21st

An npm for design engineers: The largest marketplace for React Tailwind components, modules, and hooks based on shadcn/ui.

CommonProductDesignReactUI Components

Visit

21st.dev is an open-source community registry for React UI components where anyone can publish minimal Tailwind & Radix UI components, which can be installed using npx shadcn commands. Inspired by shadcn/ui, it aims to provide design engineers with a vast marketplace of components, modules, and hooks.

Supports Pure React components
Next.js client components
TypeScript
Tailwind themes with custom configuration
custom global CSS styles
Radix UI
and other npm dependencies.
Allows users to quickly install components using a simple npx shadcn command
automatically creating necessary files and extending the Tailwind theme.
Provides detailed documentation and installation guides to help users get started quickly.

\The primary target audience is design engineers and front-end developers who need to quickly and efficiently integrate high-quality UI components into their projects to enhance development efficiency and user experience. For developers looking to use Tailwind and Radix UI in their projects
21st.dev offers a rich library of components that can save a significant amount of time and effort.\

Developers can find and install components like shadcn/ui/accordion on 21st.dev to quickly add interactive accordion effects to their web projects.
Design engineers can publish their own Tailwind theme components for sharing with other developers
promoting community growth.
Front-end teams can leverage components on 21st.dev to rapidly build prototypes
accelerating the product design and development process.

1. Visit the 21st.dev website and browse the available components.
2. Select the desired component and copy the corresponding npx shadcn command.
3. Run the command in the root directory of your project to automatically install the component and its dependencies
while extending the Tailwind theme accordingly.
4. You can further customize the component's styles and behaviors as needed.

Visit

21st Visit Over Time

Monthly Visits

490881889

Bounce Rate

37.92%

Page per Visit

5.6

Visit Duration

00:06:18

21st Visit Trend

21st Visit Geography

21st Traffic Sources

21st Alternatives

21st.dev — NPM for design engineers, enabling rapid construction of refined UIs.

InternationalSelection•React•Tailwind

186

Open Source AI Definition — Open Source AI Definition, promoting openness and collaboration in the AI field.

Programming•Open Source•Artificial Intelligence

NextUI Pro — A premium React component library for building AI-driven web applications, e-commerce platforms, and dashboards.

Design•React•Next.js

960

Uiverse.io — Thousands of free open-source UI element libraries

Design•UI•CSS

480

CopilotKit — Build in-app AI chatbots and AI-driven text areas.

Programming•React•Chatbot

402

Microapp - AI Component Generator — Use AI to create and preview React + Tailwind CSS components

Productivity•React•Tailwind

108

Ingredients — A project that combines custom photos with video using a video diffusion transformer.

Video•Video Creation•Customization

Wren AI — An open-source SQL AI agent that simplifies the conversion of text to SQL.

Productivity•Data Access•SQL Generation

Amurex — Amurex is an AI meeting assistant tool that offers real-time suggestions, meeting notes, and summary highlights.

Productivity•Meeting Assistance•Real-Time Suggestions

138

fixa — AI Voice Agent Testing and Observability Platform

Business•Voice Agents•Testing

Llama-3-Patronus-Lynx-70B-Instruct — An open-source evaluation model for detecting hallucinations, based on the Llama-3 architecture with 70 billion parameters.

Programming•Hallucination Detection•Language Model

Bakery — An open-source platform for AI model fine-tuning and monetization, empowering AI startups, machine learning engineers, and researchers.

Programming•Model Fine-tuning•Monetization

Open Deep Research — An open-source alternative that generates AI reports based on search results

Productivity•Report Generation•Search

126

Epigram — An open-source, free, and AI-driven news aggregation platform that provides concise news summaries.

Others•News•Open Source

108

vectrix-graphs — A graphical library for multi-model embeddings, supporting visualization of various models and data types.

Programming•Graph Library•Multi-Model Embedding

VITA-1.5 — VITA-1.5: A GPT-4o level multimodal large language model for real-time visual and speech interaction.

Programming•Multimodal•Large Language Model

144

DeviantArt — The world's largest online art gallery and community, showcasing and sharing various artworks.

Image•Art•Community

114

Dotomo — An entertaining reminder app that helps users tidy their rooms.

Entertainment•Organization•Reminders

opensource_notebooklm — An open source implementation of NotebookLM using Deepseek-V3 and PlayHT TTS technologies.

Programming•Open Source•AI Dialogue

162

Zasper — A super IDE designed for data science, supporting large-scale concurrent processing.

InternationalSelection•Data Science•IDE

168

PRIME-RL — PRIME enhances the reasoning abilities of language models through implicit reward-driven online reinforcement learning.

Programming•Reinforcement Learning•Reasoning Capability

GitDiagram — Convert any GitHub repository into an interactive chart for project visualization.

Programming•GitHub•Project Visualization

TangoFlux — An efficient text-to-audio generation model

Music•Text-to-audio•Audio generation

102

HuatuoGPT-o1-8B — An advanced large language model for the medical field.

Others•Healthcare•Reasoning

HuatuoGPT-o1 — A large language model for complex reasoning in the medical field

Education•Medical•Complex Reasoning

126

ReactAI Components — Rapidly build React components using AI

Programming•React•Component Generation

Best AI Websites & Tools