v150 · CSS · Images
Cursor Designer
cursor: image(<color>) hotspot-x hotspot-y, fallback creates a solid-color custom cursor from CSS alone — no PNG, no SVG, no external file. Pick a color for each zone below and hover to see the cursor change.
Hover over each zone
Zone A — hover me
Zone B — hover me
Zone C — hover me
Zone D — hover me
Zone configuration
Note:
cursor: image(<color>) is part of CSS Images Level 4. The image() function generates a 1×1 pixel image of the specified color. Browsers that don't support it fall back to the cursor keyword after the comma (e.g. pointer).
see also
- Color Swatch Lists — list-style-image with image()
- Gradient Fallback Playground — image() as fallback
- content & border-image Fills — pseudo-element placeholders
- Theme Builder — propagate color to multiple CSS slots
- ChromeStatus entry
implementation reference
Need the exact API surface, compatibility boundaries, errors, lifecycle, and source links? Read the matching gendn reference ↗