---
title: "CSS Cursor Gallery: Every Cursor Value, Live | Cursor Cove"
description: "Hover over all 36 CSS cursor keywords to see how your browser and system draw them, copy the CSS, and check support notes for iPad, Windows and macOS."
url: https://cursorcove.click/css-cursor-gallery/
---

CSS cursor gallery

# Every CSS cursor, live under your pointer

Hover over a tile to see the cursor your own browser and system draw for that keyword. Copy the CSS with one click, and read the notes where support differs.

## General 3

- `auto`
  Lets the browser decide: an I-beam over text, an arrow elsewhere.
  Also works on iPad with a mouse or trackpad.
- `default`
  The platform's normal cursor, usually an arrow.
- `none`
  Hides the cursor completely while it is over the element.
  Use with care: people lose track of where they are pointing.

## Links & status 5

- `context-menu`
  A context menu is available here.
  Chrome and Firefox show it only on macOS and Linux; on Windows you see the normal arrow.
- `help`
  Help is available, often an arrow with a question mark.
- `pointer`
  A link or something clickable, usually a pointing hand.
- `progress`
  Busy in the background, but you can keep working.
- `wait`
  Busy: wait before doing anything else here.

## Selection 4

- `cell`
  A table cell or a range of cells can be selected.
  Also works on iPad with a mouse or trackpad.
- `crosshair`
  Precise selection, as in image editors and pickers.
- `text`
  Text that can be selected, usually an I-beam.
  Also works on iPad with a mouse or trackpad.
- `vertical-text`
  Vertical text that can be selected: a sideways I-beam.

## Drag & drop 7

- `alias`
  Dropping here creates a shortcut or alias.
- `copy`
  Dropping here makes a copy.
- `move`
  The thing being dragged will be moved.
- `no-drop`
  The dragged item cannot be dropped here.
- `not-allowed`
  The action will not be carried out, as on a disabled button.
- `grab`
  Something that can be grabbed and dragged, an open hand.
  Unprefixed since Chrome 68, Firefox 27 and Safari 11; older versions needed -webkit- or -moz-.
- `grabbing`
  Something is being dragged right now, a closed hand.
  Unprefixed since Chrome 68, Firefox 27 and Safari 11.

## Resize & scroll 15

- `all-scroll`
  Can be scrolled or panned in any direction.
- `col-resize`
  A column can be resized sideways.
- `row-resize`
  A row can be resized up and down.
- `n-resize`
  The top edge can be moved.
- `e-resize`
  The right edge can be moved.
- `s-resize`
  The bottom edge can be moved.
- `w-resize`
  The left edge can be moved.
- `ne-resize`
  The top-right corner can be moved.
- `nw-resize`
  The top-left corner can be moved.
- `se-resize`
  The bottom-right corner can be moved.
- `sw-resize`
  The bottom-left corner can be moved.
- `ew-resize`
  Resizes left and right: a two-headed horizontal arrow.
- `ns-resize`
  Resizes up and down: a two-headed vertical arrow.
- `nesw-resize`
  Resizes diagonally, top-right to bottom-left.
- `nwse-resize`
  Resizes diagonally, top-left to bottom-right.

## Zoom 2

- `zoom-in`
  Something can be enlarged, a magnifier with a plus.
  Unprefixed since Chrome 37, Firefox 24 and Safari 9.
- `zoom-out`
  Something can be made smaller, a magnifier with a minus.
  Unprefixed since Chrome 37, Firefox 24 and Safari 9.

## Why the same keyword looks different

CSS only names the cursor; the operating system and browser draw it. The pointing hand, the busy indicator and the resize arrows all look different on Windows, macOS and Linux, and each person's cursor size, colour and accessibility settings change them again, so check your design on the systems your visitors use.

A few values have real gaps. Chrome and Firefox show `context-menu` only on macOS and Linux. On an iPad with a mouse or trackpad, Safari draws only `auto`, `text`, `cell` and image cursors, and shows the plain pointer for the rest. Old prefixes such as `-webkit-grab` are no longer needed.

No Windows or Linux machine nearby? [WebTraceCheck's disposable cloud browser](https://webtracecheck.com/) runs Chrome, Firefox, Edge, Brave or Chromium on an isolated Linux desktop, so you can hover over this gallery there and compare.

## Choosing the right one

Use `pointer` for things that act when clicked, `not-allowed` on disabled controls, `grab` and `grabbing` for draggable items, and the two-headed `-resize` values for splitters and handles. Keep `none` for full-screen games and video, where you draw your own pointer.

Support facts come from [MDN's cursor reference](https://developer.mozilla.org/en-US/docs/Web/CSS/cursor) and its browser compatibility data.

## Questions

**Is there a cursor called hand?**

Not any more. `hand` was an old Internet Explorer value; the standard keyword for a pointing hand is `pointer`.

**What is the difference between auto and default?**

`auto` lets the browser choose by context, so text gets an I-beam. `default` always shows the normal arrow, even over text.

**Why do I need a keyword after url()?**

The CSS rule is invalid without one, and it is what the browser shows if your image fails to load.