Skip to main content

Cursor

Atomic props for controlling the cursor style when hovering over an element.

Atomic PropsCSS Properties
cursorAliascursor: alias
cursorAllScrollcursor: all-scroll
cursorAutocursor: auto
cursorCellcursor: cell
cursorColResizecursor: col-resize
cursorContextMenucursor: context-menu
cursorCopycursor: copy
cursorCrosshaircursor: crosshair
cursorDefaultcursor: default
cursorEResizecursor: e-resize
cursorEwResizecursor: ew-resize
cursorGrabcursor: grab
cursorGrabbingcursor: grabbing
cursorHelpcursor: help
cursorMovecursor: move
cursorNResizecursor: n-resize
cursorNeResizecursor: ne-resize
cursorNeswResizecursor: nesw-resize
cursorNoDropcursor: no-drop
cursorNonecursor: none
cursorNotAllowedcursor: not-allowed
cursorNsResizecursor: ns-resize
cursorNwResizecursor: nw-resize
cursorNwseResizecursor: nwse-resize
cursorPointercursor: pointer
cursorProgresscursor: progress
cursorRowResizecursor: row-resize
cursorSResizecursor: s-resize
cursorSeResizecursor: se-resize
cursorSwResizecursor: sw-resize
cursorTextcursor: text
cursorVerticalTextcursor: vertical-text
cursorWResizecursor: w-resize
cursorWaitcursor: wait
cursorZoomIncursor: zoom-in
cursorZoomOutcursor: zoom-out
cursor={value}cursor: {value}

Usage

Use cursor{value} props to set cursor style for an element.

Result
Loading...
Live Editor

Cursor

if the preset atomic props can not be satisfied,you can use cursor props.

Result
Loading...
Live Editor