---
title: "dnd kit"
description: "Composable building blocks for dragging, dropping, sorting, and reordering."
pagination: false
---

{/* Generated from content/. Edit the catalog, not this page. */}

<PurposeNote title="Good for">Custom sortable lists and drag-and-drop interfaces in React.</PurposeNote>

## What it does

Composable building blocks for dragging, dropping, sorting, and reordering.

## When it fits

Custom sortable lists and drag-and-drop interfaces in React.

## What you build

Connect draggable and droppable elements to your application state. Choose sensors, sorting behavior, and visual feedback; test pointer and keyboard interactions in your actual layout.

## Keep in mind

You still design the interface, interaction rules, and feedback.

## Other options in this category

<div data-pagefind-ignore>

- [@hello-pangea/dnd](/drag-and-drop/hello-pangea-dnd) — Reordering items within or between lists using familiar interactions.
- [Pragmatic drag and drop](/drag-and-drop/pragmatic-drag-and-drop) — Fine-grained control over drop targets and custom interactions.
- [React DnD](/drag-and-drop/react-dnd) — Building custom drag-and-drop interactions with explicit application behavior.

</div>

## Source

[Project source for dnd kit ↗](https://dndkit.com/)

Editorial overview reviewed on October 24, 2026. Follow the source for current setup, compatibility, and licensing.

[Build a sortable list →](/tasks/build-a-sortable-list)

[All drag &amp; drop options →](/drag-and-drop)