Skip to content
STYLESCAPE

Cursor

Cursor utilities (ss-u-cursor--*) set the pointer shown over an element. Hover a tile to try it.

Cursor utilities

pointer default text move grab help wait progress crosshair not-allowed no-drop resize-ew resize-ns
HTML 
<div class="ss-c-flex ss-c-flex--wrap ss-u-gap-8">
            
            <span class="ss-c-chip ss-c-chip--outline ss-u-cursor--pointer">pointer</span>
            
            <span class="ss-c-chip ss-c-chip--outline ss-u-cursor--default">default</span>
            
            <span class="ss-c-chip ss-c-chip--outline ss-u-cursor--text">text</span>
            
            <span class="ss-c-chip ss-c-chip--outline ss-u-cursor--move">move</span>
            
            <span class="ss-c-chip ss-c-chip--outline ss-u-cursor--grab">grab</span>
            
            <span class="ss-c-chip ss-c-chip--outline ss-u-cursor--help">help</span>
            
            <span class="ss-c-chip ss-c-chip--outline ss-u-cursor--wait">wait</span>
            
            <span class="ss-c-chip ss-c-chip--outline ss-u-cursor--progress">progress</span>
            
            <span class="ss-c-chip ss-c-chip--outline ss-u-cursor--crosshair">crosshair</span>
            
            <span class="ss-c-chip ss-c-chip--outline ss-u-cursor--not-allowed">not-allowed</span>
            
            <span class="ss-c-chip ss-c-chip--outline ss-u-cursor--no-drop">no-drop</span>
            
            <span class="ss-c-chip ss-c-chip--outline ss-u-cursor--resize-ew">resize-ew</span>
            
            <span class="ss-c-chip ss-c-chip--outline ss-u-cursor--resize-ns">resize-ns</span>
            
        </div>