21st
shadcn/uiをベースに制作された数千個のUIコンポーネントを検索・コピーしてすぐに使用できる開発者プラットフォーム
無料＋有料WebAPIオープンソースLLMベース
公式サイトへ21st.dev
10Web と比較21st の代替ツールを見る概要
21st.devは、デザイナーが作成したReact UIコンポーネント、テーマ、テンプレートを検索し、プロンプトやコードをコピーしたり、CLIやMCPを通じてAIコーディングツールで使用できるようにしたりするWebプラットフォームです。無料ユーザーは毎日2つのコンポーネントをコピーでき、Builderプランでは無制限のコピーとMCP・CLI検索が提供されます。Builder + AIプランでは、月間のAIクレジットと複数モデルに基づくUI生成が追加で提供されます。
差別化ポイント
- Aceternity/Magic UI等と比べshadcn/ui生態系に特化し、追加DependencyよりSource Code Ownershipを重視するComponent Marketplaceです。
主な機能
- Magic MCP: Cursor、Windsurf、VSCode内で自然言語からUIを即座に生成
- 40以上のカテゴリに及ぶコミュニティReactコンポーネントライブラリ
- shadcn/uiおよびTailwind CSSとの完全な互換性
- 3Dやシェーダーをベースにしたプレミアムなインタラクティブコンポーネント
- 21st Agents SDKを活用したAIエージェント構築のサポート
- SVGLの統合により、数千ものブランドロゴやアイコンを提供
メリット・デメリット
ウェブ検索で収集したユーザーの声をまとめたものです
メリット
- shadcn/uiと同じCopy-paste PhilosophyでCodeを直接所有・修正でき、Hero、Background、Button、Form等多数CategoryからUIを素早く追加できます。AI Chat UIやWebGL Shader等の高度Componentも含みます。
デメリット
- 2024年開始の新しいMarketplaceでComponent品質にばらつきがあり、shadcn/ui以外のDesign Systemには直接使いにくいです。文書・韓国語資料が少なく、一部Premium ComponentにはToken費用がかかります。
料金
無料＋有料開始価格: $0 (Free plan available); paid plans start at $6/month billed yearly
Freeは月5 tokens。Proは月$20（年払い月$16）で月50 tokens。AI Component生成は1 token、Premium Library Unlockは5 tokens等のToken方式です。
情報確認日: · 料金は公式ページで再確認してください
活用事例
- CursorやWindsurf内での自然言語に基づく超高速なUIプロトタイピング
- shadcn/uiプロジェクトへの高品質なコンポーネントの即時コピー＆ペースト
- 高度なアニメーションを含むAIチャットインターフェースの構築
- 3D要素を含むマーケティングランディングページの制作
対象ユーザー
フロントエンド開発者デザインエンジニアAI Coding Tool利用者React・Tailwindチーム
検証の根拠
会社・料金・機能の情報は、以下の一次情報と直近の検証記録に基づいて表示しています。出典が食い違う場合は、公式の一次情報と最新の検証結果を優先します。
最終検証 2026/08/23検証済み出典2件
代替ツール
この代わりに使えるツール
