Top 5 Drag-and-Drop Libraries for React

This page summarizes the projects mentioned and recommended in the original post on dev.to

Civic Auth - Auth in Less Than 5 Minutes
Civic Auth comes with multiple SSO options, optional embedded wallets, and user management — all implemented with just a few lines of code. Start building today.
www.civic.com
featured
CodeRabbit: AI Code Reviews for Developers
Revolutionize your code reviews with AI. CodeRabbit offers PR summaries, code walkthroughs, 1-click suggestions, and AST-based analysis. Boost productivity and code quality across all major languages with each PR.
coderabbit.ai
featured
  1. dnd

    💅 Beautiful and accessible drag and drop for lists with React. ⭐️ Star to support our work!

    hello-pangea/dnd is a fork of react-beautiful-dnd, the legendary DnD library originally developed by Atlassian. It was designed specifically for list-based drag-and-drop interactions, prioritizing accessibility and smooth animations in kanban style UIs, like Trello.

  2. Civic Auth

    Auth in Less Than 5 Minutes. Civic Auth comes with multiple SSO options, optional embedded wallets, and user management — all implemented with just a few lines of code. Start building today.

    Civic Auth logo
  3. gridstack.js

    Build interactive dashboards in minutes.

    Gridstack.js is a drag-and-drop library built specifically for grid-based layouts. If you're building interactive dashboards or anything that requires draggable and resizable grid items, this library takes care of most of the heavy lifting right out of the box.

  4. react-beautiful-dnd

    Beautiful and accessible drag and drop for lists with React

    hello-pangea/dnd is a fork of react-beautiful-dnd, the legendary DnD library originally developed by Atlassian. It was designed specifically for list-based drag-and-drop interactions, prioritizing accessibility and smooth animations in kanban style UIs, like Trello.

  5. formkit

    Vue Forms ⚡️ Supercharged

    formkit/drag-and-drop is a relatively new, lightweight library developed by the team behind FormKit, a form framework for Vue. Unlike traditional drag-and-drop libraries that manipulate the DOM directly, this one takes a different approach: instead of physically moving elements around, it updates a underlying reactive data model that you provide. This means that rather than worrying about manually reordering elements, you let the library handle updates to your data structure, making it feel more like a natural extension of reactive frameworks.

  6. puck

    The visual editor for React

    ⭐ Support us on GitHub by dropping a star

  7. dnd-kit

    The modern, lightweight, performant, accessible and extensible drag & drop toolkit for React.

    dnd-kit is a modern, lightweight toolkit for building drag-and-drop experiences in React. This library takes a unique approach because it doesn’t give you a pre-built DnD system—it's a framework you can use to build your own. This means you get full control over the DnD behavior, styling, and interactions, without being boxed into a rigid API. That flexibility is exactly why we decided to use it for Puck.

NOTE: The number of mentions on this list indicates mentions on common posts plus user suggested alternatives. Hence, a higher number means a more popular project.

Suggest a related project

Related posts

  • Build a Sleek & Sortable Drag-and-Drop Kanban in React – No Hassle!

    1 project | dev.to | 17 Mar 2025
  • I made Webflow but for Python UI. Here's how I built it

    6 projects | dev.to | 3 Oct 2024
  • A feature-rich front-end drag-and-drop component library

    10 projects | news.ycombinator.com | 24 Apr 2024
  • Curious case of Drag and Drop

    3 projects | dev.to | 30 Jan 2024
  • Janky drag & drop animation using hello-pangea/dnd package (app dir)

    1 project | /r/nextjs | 17 Oct 2023

Did you know that TypeScript is
the 1st most popular programming language
based on number of references?