機能紹介ブロック
製品の機能とメリットを紹介します。 ネオブルータリズム調のすぐ使える React UI ブロックです。ヒーロー、料金、認証、ダッシュボードなど。あらゆる画面サイズでプレビューし、コードをコピーするか、MCP サーバー経由で AI エージェントからインストールできます。Radix UI・Base UI・React Aria に対応。
- Hero・料金・認証
- すべてのブレークポイントをプレビューする
- ソースをコピーする
- MCP インストール準備完了
- Radix · Base UI · React Aria
- 158 既製のブロック
- 出荷されるページセクション
- ダッシュボードとマーケティング
- Pro コードのロックを解除する
- ドロップインレイアウト
すべてのレイアウトを参照
機能紹介
11 個のブロック、任意のカードをクリックして全画面プレビュー、コード、インストール手順を表示。
- 01Pro
非対称フィーチャーカード
見出しとアイコンバッジの下、CTAを唯一持つ縦長カード1枚の横に短いカード2枚を積み重ねます。React・Tailwind対応、3つの機能に優先順位を。
- 02Pro
Bentoサービスフィーチャーグリッド
縁から縁まで続くBentoパネル、罫線そのものがレイアウトとなり各パネルが独自の色・コピー・ボタンを持ちます。React・Tailwind対応、サービス内容を書くだけ。
- 03Pro
罫線付きサービスフィーチャー行
カードも塗りもなし。罫線で仕切られた3つのセルは、ホバーで温かみを帯びると丸いアイコンタイルが平らになります。React・Tailwind対応、ページ下部にふさわしい静けさ。
- 04Pro
中央配置フィーチャー統計カード
全幅のカラーバンドの上に中央配置のパネルが1枚、アイコンバッジ・主張・3枚の統計カード・ボタンを収めます。React・Tailwind対応、一息つかせる区切りに。
- 05Pro
コードプレビュー分割フィーチャー
証拠はスクリーンショットではなくターミナル。罫線付きの3機能の横でデプロイログを再生し、傾いたブロックに2枚の稼働率タイル。React・Tailwind対応、出力を貼り替えるだけ。
- 06Pro
アイコンカード3点セット
薄い色の帯の上に対等なカードが並び、各カードに丸いアイコンタイルと角に切り込む回転した四角形。React・Tailwind対応、面のペアで自由に配色を。
- 07Pro
メトリクスバンドフィーチャー
2行の主張の横に4枚のメトリクスカードが2×2で並ぶ、コントラストの強い帯。クリックする要素はなし。React・Tailwind対応、セクションの合間に挟むだけ。
- 08Pro
モバイルアプリフィーチャーリスト
スマホのモックアップの横に、成果として書かれた3つのメリット行、オフセットシャドウ付きの見出し、2つのCTA。React・Tailwind対応、新しいモックアップを書き出すだけ。
- 09Pro
スマホモックアップフィーチャーグリッド
中央のスマホモックアップを4枚のカードが両脇から挟み、各カードが独自の全幅ボタンで締めくくられ、対角線上に装飾。React・Tailwind対応、枚数は偶数に。
- 10Pro
スタックカードフィーチャー
全幅のカラーバンドの上でアイコン行が主張を語り、重なり合う証拠カードのコラージュがそれに答えます。React・Tailwind対応、ヒーローの下に置くだけ。
- 11Pro
タグ付きフィーチャーカードグリッド
6枚のカードはそれぞれ1つのリンクで、カテゴリタグが付き、ホバーで矢印が動くフッターバーで締めくくられます。React・Tailwind対応、6枚または12枚で。