Custom Cursor Generator
Upload a small image to use as a custom mouse cursor, click where its "hotspot" (the actual pointer position) should be, and copy the CSS — try it live in the test zone below.
Click on the image below, or type X and Y, to set the hotspot: the exact point that clicks (default: top-left corner).
About this tool
Browsers only honour a custom cursor image up to 128×128px (larger images fall back to the default arrow), so bigger images are scaled down for you, and you can pick a standard size such as 32px. The hotspot is measured in whole pixels of the final cursor, not the enlarged preview, and moves with the image if you change the size. The image is embedded in the CSS as a PNG data URI, so there’s no separate file to upload.
Keep the , auto fallback at the end: it’s used if the image can’t load. Custom cursors don’t appear on touchscreens, and an unusual cursor can make it hard for some people to see where they’re pointing, so use them for fun or for specific areas (such as a drawing canvas) rather than a whole site.