# CSS Cursor Grab on List Item Hover for Drag and Drop

> Set the CSS cursor property to grab on the :hover pseudo-class of list items so the cursor becomes a hand icon whenever draggable items can be picked up

**URL:** https://sentry.io/answers/how-to-change-the-cursor-into-a-hand-when-a-user-hovers-over-a-list-item-css/

---

## The Problem

You have a list where items can be moved by clicking and dragging. How do you change the cursor to look like a hand to indicate that the items can be grabbed?

## The Solution

Set the [`cursor`](https://developer.mozilla.org/en-US/docs/Web/CSS/cursor) CSS property of the list items to "grab" using the `:hover` pseudo class selector:

```css
li:hover {
  cursor: grab;
}
```

---

*Source: [sentry.io/answers/how-to-change-the-cursor-into-a-hand-when-a-user-hovers-over-a-list-item-css/](https://sentry.io/answers/how-to-change-the-cursor-into-a-hand-when-a-user-hovers-over-a-list-item-css/)*