Appearance

Cursor

Style syntax for setting the mouse cursor style.

🚧This page is still under construction and some content may not be complete.

Class	Declarations
`cursor:value`	`cursor: value`
`cursor:auto`	`cursor: auto`
`cursor:alias`	`cursor: alias`
`cursor:all-scroll`	`cursor: all-scroll`
`cursor:cell`	`cursor: cell`
`cursor:col-resize`	`cursor: col-resize`
`cursor:context-menu`	`cursor: context-menu`
`cursor:copy`	`cursor: copy`
`cursor:crosshair`	`cursor: crosshair`
`cursor:default`	`cursor: default`
`cursor:e-resize`	`cursor: e-resize`
`cursor:ew-resize`	`cursor: ew-resize`
`cursor:grab`	`cursor: grab`
`cursor:grabbing`	`cursor: grabbing`
`cursor:move`	`cursor: move`
`cursor:n-resize`	`cursor: n-resize`
`cursor:ne-resize`	`cursor: ne-resize`
`cursor:nesw-resize`	`cursor: nesw-resize`
`cursor:no-drop`	`cursor: no-drop`
`cursor:none`	`cursor: none`
`cursor:not-allowed`	`cursor: not-allowed`
`cursor:ns-resize`	`cursor: ns-resize`
`cursor:nw-resize`	`cursor: nw-resize`
`cursor:nwse-resize`	`cursor: nwse-resize`
`cursor:pointer`	`cursor: pointer`
`cursor:progress`	`cursor: progress`
`cursor:row-resize`	`cursor: row-resize`
`cursor:s-resize`	`cursor: s-resize`
`cursor:se-resize`	`cursor: se-resize`
`cursor:sw-resize`	`cursor: sw-resize`
`cursor:text`	`cursor: text`
`cursor:vertical-text`	`cursor: vertical-text`
`cursor:w-resize`	`cursor: w-resize`
`cursor:wait`	`cursor: wait`
`cursor:zoom-in`	`cursor: zoom-in`
`cursor:zoom-out`	`cursor: zoom-out`

<div class="cursor:pointer">submit</div>

Basic usage

Set the cursor style

Use the cursor:value to change the mouse cursor when hovering an element.

Hovering the button to see the cursor style

<button class="cursor:pointer">submit</button>

Conditionally apply

Apply styles in different states using selectors, media queries, etc.

<div class="cursor:pointer:hover cursor:pointer@sm cursor:pointer@dark cursor:pointer@print">…</div>

Style syntax for setting foreground color of an element.

Style syntax for setting all background style properties at once.

MIT License © Aoyue Design LLC.

Issue on this page