21st-ui

Community

Install React UI components & logos

Authorjakubkrzysztofsikora
Version1.0.0
Installs0

System Documentation

What problem does it solve?

This Skill streamlines the process of finding, inspecting, and integrating high-quality React UI components and brand logos into your projects, saving significant development and design time.

Core Features & Use Cases

  • Component Discovery: Browse and search a vast registry of shadcn/ui-compatible React components from 21st.dev.
  • Logo Search: Find and download SVG brand logos from SVGL.app for use in your UI.
  • Direct Installation: Use the shadcn-cli to directly install components into your project.
  • Use Case: You're building a new Next.js application and need a visually appealing "bento grid" layout and the logo for "Stripe" to include in your footer. This Skill can find both and provide the exact commands to add them to your project.

Quick Start

Use the 21st-ui skill to find and install the 'bento-grid' component from the 'magicui' author.

Dependency Matrix

Required Modules

python3

Components

scriptsreferences

💻 Claude Code Installation

Recommended: Let Claude install automatically. Simply copy and paste the text below to Claude Code.

Please help me install this Skill:
Name: 21st-ui
Download link: https://github.com/jakubkrzysztofsikora/C4/archive/main.zip#21st-ui

Please download this .zip file, extract it, and install it in the .claude/skills/ directory.
View Source Repository

Agent Skills Search Helper

Install a tiny helper to your Agent, search and equip skill from 223,000+ vetted skills library on demand.