Custom Cursor Maker
Make your own mouse cursor. Draw one on a pixel grid, start with a shape, or turn any picture into a cursor, then set the exact click point and try it out on this page before you download. You get a real .cur file for Windows with the sizes you choose, plus a PNG and copy-ready CSS for your website. It also opens existing .cur files, so you can change a cursor you already have. Free, with no sign-up and no watermark.
100% private — everything runs in your browser. Your images stay in your browser; the .cur, PNG and ZIP are made on your device.
Or start with a shape
Click point (hotspot)
Test your cursor
Move your pointer over the panel, then click. A red dot marks the exact spot each click lands, so you can see whether the click point sits where you want it. It needs a mouse or trackpad.
Windows .cur file
Website cursor (PNG and CSS)
Your images stay in your browser: nothing is uploaded. Free, no sign-up, no watermark.
How to make a custom cursor
- Pick a shape, draw on the grid, or add an image: drop it in, paste it, or choose a file.
- Use Remove a plain background if your picture has one, and Add outline so the cursor shows on light and dark pages.
- Choose Set click point and click the pixel that should do the clicking, usually the tip. The red square shows where it is.
- Move your pointer over the test panel and click. A red dot marks where each click lands.
- Tick the sizes you want and download the .cur file, or copy the CSS for your website.
What you can use it for
- A personal mouse pointer for your Windows PC
- A themed cursor for a website, game page or portfolio
- A crosshair or pointer for a browser game
- Turning your pixel art or logo mark into a cursor
- Editing a .cur file you already have: new colours, new click point, more sizes
What a custom cursor needs
A cursor is a small picture with one extra piece of information: the click point. Microsoft calls it the hot spot, the pixel that marks the exact screen location a click affects. A good cursor has a click point on its tip or centre, shows up on both light and dark backgrounds, and comes in the size the screen expects.
- Click point. Set it with the tool, type the X and Y, or use Top left and Centre. When the tool resizes your cursor, the click point moves with it.
- Outline. A dark cursor vanishes on a dark page. Add outline puts a one-pixel edge around the shape.
- Clear pixels. Everything you leave empty stays see-through, in the .cur and the PNG.
- Crisp or smooth. Crisp pixels suits drawn cursors and pixel art. Smooth suits photos and logos. Draw at the largest size you need: a cursor drawn at 32 goes up in blocks.
Cursor sizes on Windows
Windows doesn’t use one cursor size. Microsoft’s documentation lists these standard sizes at the default pointer setting:
| Display scale | Cursor size |
|---|---|
| Under 150% | 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 size also changes with Settings, Accessibility, Mouse pointer and touch, Size. A .cur file can hold several sizes, and Windows picks the best match, so a file with 32, 48 and 64 stays sharp on more screens. The visible shape is usually smaller than the box: Microsoft notes that transparent edges are normal, which is why the Arrow starter doesn’t fill the grid.
Which file to use
| Where | File | Why |
|---|---|---|
| Windows pointer | .cur | Holds several sizes and its own click point, and Windows picks the best match |
| Website, everyday | PNG at 32 px with CSS | Inside the size browsers recommend; easy to embed in the CSS |
| Website, larger or playful | PNG up to 128 px with CSS | Works, but can swap back to the normal pointer near the browser’s toolbars and edges |
| Your own app or game | .cur or PNG | Depends on the engine: check what it loads |
How to install a cursor on Windows
- Save the .cur file in a folder you’ll keep.
- Open Start, then Settings, Bluetooth & devices, Mouse.
- Under Related settings, click Additional mouse settings.
- In Mouse Properties, open the Pointers tab.
- In the Customize list, select the pointer to change. Normal Select is the everyday arrow.
- Click Browse, choose your file and click Open.
- Click OK. To undo it, pick your usual option from the Scheme list.
These steps follow Microsoft’s support page for Windows 11.
Custom cursors on a website
The CSS cursor property takes one or more images, each with an optional click point, and must end with a keyword as a backup. The numbers are in image pixels, counted from the top left.
body {
cursor: url("my-cursor.png") 0 0, auto;
}- MDN recommends 32 × 32 pixels. Firefox and Chromium limit images to 128 × 128 by default, and generally ignore larger ones.
- Browsers commonly block cursor changes that cross their own toolbars, so a big cursor can flip back to the normal pointer near the edge.
- Set the cursor on links and buttons too. If you set it on the body, a link’s own pointer cursor still takes over on hover. Type
a, buttonin the CSS selector box to make a second cursor for them. - Using a .cur on a website? Tick one size. In our test, Chrome opened an 8-size .cur at its largest size, 256 px, which is over the limit above.
- Keep it clear. People read the cursor to know what they can click, so use a custom one where it adds something, and keep the click point obvious.
- To go with it, try the CSS Button Generator and CSS Scrollbar Generator.
Tips for a better cursor
- Design at 32 × 32 first. It shows you how little detail fits, and it’s the size MDN recommends for websites.
- Point up and left. People expect the tip of an arrow at the top left, and that’s where the Arrow starter puts it.
- Have a bigger drawing to start with? Clear the background with Remove Background, then add it here.
- For detailed pixel art, draw in the Pixel Art Maker and bring the PNG here. Pictures up to 128 pixels stay crisp.
- Need a program icon instead? Use the ICO Converter or Favicon Generator.
More free design tools
Building an interface?
Icons, pixel art and CSS tools that run in your browser: free, private, no sign-up.
See all free tools →Frequently asked questions
How do I make a custom cursor?
Draw on the grid, pick a starter shape or add a picture. Set the click point, test it in the panel, then download the .cur file. On a website, copy the CSS instead.
Is this custom cursor maker free?
Yes. Every size and download is free, with no sign-up and no watermark.
Are my images uploaded?
No. Your picture is read and converted in your browser, and nothing leaves your device.
Is the .cur file a real cursor file?
Yes. It’s built in the Windows cursor format, not a renamed picture: each size is stored with full colour, see-through edges and its own click point. We check the downloaded bytes in our tests, and Chrome opens the files as images.
What is a hotspot on a cursor?
The hotspot, or click point, is the one pixel that counts when you click. On an arrow it’s the tip, and on a crosshair it’s the middle. If it’s set wrong, your clicks land away from where the cursor seems to point.
How do I install a custom cursor on Windows 11?
Open Start, then Settings, Bluetooth & devices, Mouse. Under Related settings, click Additional mouse settings and open the Pointers tab. Select the pointer to change in the Customize list, click Browse, choose your .cur file, click Open, then OK.
How do I go back to the normal cursor?
Open the same Pointers tab and choose your usual option from the Scheme list, such as the Windows default, then click OK.
Can I use a custom cursor on a Mac?
The .cur file is a Windows format. Apple’s pointer settings, under System Settings, Accessibility, Display, cover size and outline and fill colours, and they don’t list an option for loading a cursor file. A cursor on a website works on a Mac through CSS, so use the PNG for that.
How big can a cursor be on a website?
MDN says Firefox and Chromium limit cursor images to 128 × 128 pixels by default and recommends 32 × 32. Anything over the limit is generally ignored, so the backup cursor shows instead.
Why does my big cursor disappear near the edge of the browser?
Browsers guard against cursors that cover their own controls. Firefox has limited cursors over browser controls to 32 pixels since version 67, and a post on the Chromium developer list describes the same swap at window edges on macOS for cursors over 32. Stick to 32 pixels if that matters.
Why does CSS need a backup cursor?
The cursor property requires a keyword such as auto at the end of the list. Browsers use it when the image can’t load. This tool adds it for you, and you can choose which one.
Should I use PNG or .cur on a website?
PNG is the simple choice, and browsers are required to support it. Desktop browsers also broadly support .cur. Turn on the file links option and the CSS lists the PNG first, with the .cur as a second choice.
Which sizes should I put in my .cur file?
Windows uses 32 pixels on a display under 150% scale and larger sizes at higher scales, and picks the best match from your file. The default of 32, 48 and 64 covers display scales up to 299%. Add 96 and 128 for higher scale settings.
Does a custom cursor work on phones and tablets?
Phones have no pointer, so there’s nothing to change. On an iPad with a mouse or trackpad, MDN says the only cursor value that changes the pointer is text, so image cursors don’t show. You can still draw and download on a phone, then test on a computer.
Can I edit an existing cursor?
Yes. Add a .cur or .ico file. The largest size opens on the grid with its click point, ready to change and save again. Animated .ani files aren’t supported.
Can I make an animated cursor?
Not with this tool: it makes still cursors. To draw animation frames as pixel art, try our Pixel Art Maker.
Can I use this cursor in Chrome on every website?
A website’s CSS changes the cursor on that website only. To change it everywhere on a Windows PC, set the .cur file in Windows mouse settings, which replaces the pointer across the system. A page that sets its own cursor will still show that one.
Can I use any picture?
Use images you made or have the right to use. The starter shapes here are our own drawings and are free for any use.