Mouse Cursors
A little detail, a little personality.
Free cursors for your personal blog or website.
Choose Your Cursor
30 cursors · Ready-to-copy CSS
Use LIGHT / DARK to change a preview’s background. Choose Copy Code to use your favourite cursor.
Cursor 01
Right-click the image to save it.
Show Code
Cursor 02
Right-click the image to save it.
Show Code
Cursor 03
Right-click the image to save it.
Show Code
Cursor 04
Right-click the image to save it.
Show Code
Cursor 05
Right-click the image to save it.
Show Code
Cursor 06
Right-click the image to save it.
Show Code
Cursor 07
Right-click the image to save it.
Show Code
Cursor 08
Right-click the image to save it.
Show Code
Cursor 09
Right-click the image to save it.
Show Code
Cursor 10
Right-click the image to save it.
Show Code
Cursor 11
Right-click the image to save it.
Show Code
Cursor 12
Right-click the image to save it.
Show Code
Cursor 13
Right-click the image to save it.
Show Code
Cursor 14
Right-click the image to save it.
Show Code
Cursor 15
Right-click the image to save it.
Show Code
Cursor 16
Right-click the image to save it.
Show Code
Cursor 17
Right-click the image to save it.
Show Code
Cursor 18
Right-click the image to save it.
Show Code
Cursor 19
Right-click the image to save it.
Show Code
Cursor 20
Right-click the image to save it.
Show Code
Cursor 21
Right-click the image to save it.
Show Code
Cursor 22
Right-click the image to save it.
Show Code
Cursor 23
Right-click the image to save it.
Show Code
Cursor 24
Right-click the image to save it.
Show Code
Cursor 25
Right-click the image to save it.
Show Code
Cursor 26
Right-click the image to save it.
Show Code
Cursor 27
Right-click the image to save it.
Show Code
Cursor 28
Right-click the image to save it.
Show Code
Cursor 29
Right-click the image to save it.
Show Code
Cursor 30
Right-click the image to save it.
Show Code
How to Use Your Cursor
These cursors use standard CSS, so they are not limited to Blogger. You can also use them on a personal website that allows custom CSS.
Choose a cursor and click Copy Code. Then follow the instructions for your website below. If automatic copying is blocked, open Show Code and copy the entire code manually.
For Blogger
- Sign in to Blogger and select the blog where you want to use the cursor.
- Open Theme and click Customize.
- Choose Advanced, open its dropdown menu and select Add CSS.
- Paste the complete cursor code at the end of that CSS field. Keep any unrelated CSS you already have.
- Click Save, open your blog and refresh the page. Move your mouse over the blog to try the cursor.
Important: Paste only the copied CSS here, without <style> tags. Do not replace your full Blogger template or paste the cursor CSS into a post as text.
For Other Websites
Option 1 · Custom CSS field or CSS file
- Open your website’s Custom CSS settings, or the CSS stylesheet loaded by your website. The setting’s name depends on your platform.
- Paste the complete cursor code at the end, keeping your existing CSS. Do not add
<style>tags in a CSS field or file. - Save or publish the changes, then refresh your website and test it with a mouse.
Option 2 · If you edit the website’s HTML
Place the copied cursor CSS between opening and closing <style> tags inside the document’s <head>, before </head>:
<style>
/* Replace this comment with the
complete code from Copy Code. */
</style>
Use one of these options, not both. If your website builder does not allow custom CSS or HTML editing, this method may not be available.
Good to Know
- One cursor at a time: To switch designs, replace only your previous cursor code with the new one. Do not remove unrelated website styles.
- Keep the image available: The copied code loads the cursor from its image address. That address must remain accessible. You can also host the image yourself using the instructions below.
- Mouse users: This changes the cursor over your website, not the device’s system cursor. Touch-only phones and tablets normally do not show a mouse cursor; browser support can vary.