Custom cursors on macOS: what works and what does not

Step 1: Know your three options

1. Built-in settings. Change the pointer’s size, outline colour and fill colour. Safe, simple, and it survives updates.
2. A community tool. Replace the cursor images themselves. It works, but it relies on software Apple does not support, and macOS updates can break it.
3. CSS on your own website. If you want a custom cursor for visitors, not for yourself, you do not need to change macOS at all.

Step 2: Change size and colour in System Settings

1. Open System Settings > Accessibility > Display.
2. Scroll to the Pointer section.
3. Drag Pointer size to make the arrow bigger.
4. Use Pointer outline color and Pointer fill color to recolour it. A dark fill with a bright outline is easiest to spot.
5. Turn on Shake mouse pointer to locate if you often lose the pointer: a quick shake makes it huge for a moment.
6. Click Reset to go back to the black arrow with a white outline.

Older versions of macOS put these options under System Preferences > Accessibility > Display. Pointer colours arrived with macOS Monterey.

Step 3: Replace the cursor images with a community tool

The best known option is Mousecape, a free, open-source app that swaps the system cursors for images in a “cape” file. Before you install anything like it:

• Check that it supports your macOS version. Community reports say the original Mousecape release works up to macOS Sequoia, and that macOS Tahoe needs a maintained fork. Read the project’s release notes first.
• Expect a security warning. These tools are not distributed through the App Store, so macOS asks you to confirm before opening them.
• Know how to undo it. Find the reset or uninstall option before you apply a cape.

To build your own cape, export each cursor as a PNG at two sizes, for example 32 and 64 pixels, so it looks sharp on Retina screens. The cursor maker and the CUR to PNG converter both give you PNG files. You will also need each cursor’s hotspot, the pixel that does the clicking.

Step 4: For websites, use CSS instead

If the goal is a branded cursor on your website, skip macOS settings entirely. Safari, Chrome and Firefox on a Mac all show CSS cursors:

.brand-zone {
  cursor: url("arrow.svg") 4 2, url("arrow.png") 4 2, auto;
}

The url() reference covers sizes, hotspots and the rules browsers apply near the page edges.

Step 5: Match Mac cursor names to CSS

If you are designing a set for the web, these are the macOS cursors the CSS keywords turn into:

macOS cursor	CSS keyword
Arrow	default
Pointing hand	pointer
I-beam	text
Open hand	grab
Closed hand	grabbing
Crosshair	crosshair
Operation not allowed	not-allowed
Contextual menu	context-menu
Drag copy	copy
Drag link	alias

Each page in the CSS cursor reference gives the Windows and macOS name for its keyword.

FAQ

Can I use Windows .cur or .ani files on a Mac?

Not directly. macOS cannot install them. Convert a .cur to PNG with the CUR to PNG converter and import the PNG into a community tool. For an animated .ani, export its frames as PNG first.

Why did my custom cursor disappear after a macOS update?

Community cursor tools hook into parts of macOS that Apple can change at any time. After a major update, check whether the tool has a new release, then apply your cape again.

Can I make the pointer bigger without installing anything?

Yes. System Settings > Accessibility > Display > Pointer size makes the system pointer larger, and Shake mouse pointer to locate briefly enlarges it when you shake the mouse.