Cursor design
Skill Dragoon0x/everything-design-taste/skills/cursor-design
Custom cursor design, cursor states, and pointer interaction feedback.From its SKILL.md
npx -y skills add Dragoon0x/everything-design-taste --skill cursor-designAssembled from the repository path, not quoted from the project. Check it against their README if it does not work.
One thing to look at
- 9 stars9 stars. Stars are a popularity signal and not a quality one, but at this level it is likely that nobody has read this closely except its author, and you would be relying on your own review.
SKILL.md
1.1 KB, 233 tokens by cl100k_base, as published. Nobody here has run it
Cursor Design
Cursor States
| Cursor | When |
|---|---|
| default (arrow) | Normal interaction |
| pointer (hand) | Clickable elements (links, buttons) |
| text (I-beam) | Text content, input fields |
| grab / grabbing | Draggable elements |
| not-allowed | Disabled or unavailable actions |
| wait / progress | Loading (avoid — prefer inline indicators) |
| zoom-in / zoom-out | Zoomable images |
| crosshair | Precise selection (drawing, cropping) |
| col-resize / row-resize | Resizable borders |
Custom Cursors
- Use sparingly. Custom cursors can confuse users.
- Maximum size: 32x32px (128x128 on high-DPI).
- Maintain the hotspot in the expected position.
- Portfolio/creative sites: custom cursors can be a signature element.
- Apps/tools: stick with system cursors.
Rules
- Every interactive element should have cursor: pointer.
- Never hide the cursor (except in fullscreen media/games).
- Disabled elements: cursor: not-allowed + reduced opacity.
What ships with it
Read from the repository
Just SKILL.md. No reference files, no scripts.