Why does my custom cursor click in the wrong place?
Every cursor has one pixel, the hotspot, that marks where a click lands; Microsoft gives the tip of an arrow and the middle of a crosshair as the typical places. A .cur file stores that point for each size. An .ico file does not: the same two numbers hold the icon's colour planes and bits per pixel instead. That is why renaming an icon to .cur, advice that turns up on forums, clicks in the wrong spot. We tested it: Windows loaded a 32 px .ico renamed to .cur with its click point at 1, 32, the bottom-left corner, because it read the planes value (1) and the bits per pixel (32) as the point. Users on Super User and Stack Overflow describe exactly that bottom-left click.
This page writes a real cursor, with the click point you choose: click the picture, use a preset (top-left for an arrow, centre for a crosshair or circle) or type the pixel. The point is kept at the same place on every size, and the result lists the exact point stored for each. In our test, Windows' own cursor loaders (LoadCursorFromFile and LoadImage) opened a cursor made on this page at 32, 64 and 128 px with the point at 0, 0 on every size for an arrow tip, and a 32 px cursor with a centre point at 16, 16.
Which cursor sizes should a .cur file have?
Windows draws cursors at fixed sizes that step up with your display scaling, and it picks the stored size closest to the one it needs. Microsoft lists them:
| Display scaling | Cursor size Windows asks for |
|---|---|
| Up to 149% | 32 × 32 px |
| 150% to 199% | 48 × 48 px |
| 200% to 299% | 64 × 64 px |
| 300% to 399% | 96 × 96 px |
| 400% and up | 128 × 128 px |
The pointer size slider (Settings › Accessibility › Mouse pointer and touch › Size) also changes the size, separately from scaling. So for a Windows pointer this page includes all of 32, 48, 64, 96 and 128 px, the sizes in Microsoft's table and the same five sizes we found in every cursor in Windows 11's own Cursors folder: at any display scaling, Windows finds its size stored. The slider can ask for other sizes, including larger ones, which Windows then makes by scaling. A cursor with only one size is scaled whenever Windows needs another, and users report that custom cursors then look blurry.
How do I use a .cur file in Windows 11 or 10?
- Download the .cur and keep it somewhere it will stay, such as a Cursors folder in your Documents.
- Open Mouse Properties: in Windows 11, Settings › Bluetooth & devices › Mouse › Additional mouse settings; in Windows 10, Settings › Devices › Mouse › Additional mouse options.
- On the Pointers tab, select the pointer to replace (Normal Select is the arrow), click Browse, pick your .cur and click Open.
- Click Save As to keep the set as a scheme, then OK.
The Browse box takes only .cur and .ani files, which is why going from PNG to cursor needs a conversion first: a PNG cannot be picked there. An animated pointer needs an .ani file, a different format; this page makes still cursors only.
How do I use a custom cursor on a website?
Choose the website preset (32 px). Chrome and Firefox refuse cursor images over 128 px, and with a multi-size .cur they use its largest image, so a Windows-style file with 128 px inside would show a huge pointer. Chrome also hides cursors bigger than 32 px when they touch the browser's own interface, and MDN recommends 32 × 32. Then add:
.my-area { cursor: url("pointer.cur"), auto; }With no numbers after the URL, Chrome and Firefox use the click point stored in the .cur file, as the CSS specification says. You can also give it in CSS (url("pointer.png") 4 2, auto, measured from the top-left), which also works with a plain PNG. Always end with a keyword such as auto or pointer: the rule needs one as the fallback. The box under the result shows your 32 px cursor this way, so you can check the click point before downloading.
What makes a good cursor image?
- A square PNG with a transparent background. The cursor keeps a full 8-bit alpha channel, so soft edges stay soft.
- Leave the shape smaller than the square: Microsoft notes the visible arrow is usually smaller than its 32 px image, with transparent edges.
- Bold outlines: at 32 px, thin lines disappear. An SVG is drawn fresh at each size, so it stays sharp.
- A dark shape with a light outline (or the reverse) stays visible on both light and dark windows.
What this page writes
Each size is stored the way Windows' default (Aero) cursors are: a 32-bit image with an alpha channel plus a 1-bit mask for programs that ignore alpha, rather than a PNG inside the file (Microsoft documents PNG images in cursors only for cursors compiled into programs). The file is type 2, a cursor, with each click point in its entry. Everything is made in your browser; the picture never leaves your device. To look inside an existing cursor, including its click point, use the ICO to PNG converter, which opens .cur files too.