Emoji Cursor

Use emojis as mouse cursors by combining SVG with CSS.

Steps:

  1. Choose your preferred emoji from the list below or provide your own.
  2. Adjust the size.
  3. Hover over the preview box to see the result.
  4. Copy the CSS and place it in your website stylesheet.

Options

{{ range }}
Above 50 can cause blurriness and browser glitches.

Hover to Preview

Notes:

Made by Kyle (, , blog).

Source on github.

How to support

Buy me a coffeeFeel free to buy me a coffee if this page has helped you or contact me for web development consulting.

This site is for generating and testing mouse cursors, so unfortunately it is unusable on a mobile device.