21st.devとは

React・Tailwind向けのUIコンポーネント、画面、テーマを探せるコミュニティライブラリです。プレビューと導入コマンドを一緒に確認できます。

UIコンポーネンの探し方

hero、pricing table、login formなど具体的な用途で検索し、PCとスマホの表示、必要パッケージ、ライセンスを確認します。

shadcn形式で導入する

npx shadcn@latest add https://21st.dev/r/author/component

実際の詳細ページに表示されたURLを使います。導入後は差分、キーボード操作、モバイル表示を確認してください。

導入後に確認すること

ビルドと型チェックを実行し、不要な依存関係やデザイントークンの重複がないか調べます。