なぜBoardUI
ソースコードはあなたのもの
Components are copied into your project as plain React + Tailwind files. No runtime package, no lock-in, nothing you cannot open and edit.
AIエージェント向け構築
An MCP server installs components on request, and always-on design rules keep your agent on the token system instead of inventing its own.
デフォルトでアクセス可能
Every form component builds on React Aria: labels, focus management, keyboard behavior, and ARIA wiring come included.
Figmaで最初に設計されている
Every component starts as a finished Figma frame and lands in code pixel for pixel, carried by 400+ design tokens.
ダークモード内蔵
Semantic tokens flip automatically under the .dark class. You never write a dark: override or a raw hex value.
一日からのデータ量
19 chart cards, dashboard blocks, and 10 full-page templates, made for products where the data is the interface.
インストール
モノレポや独自のインポートエイリアスを使う場合は、共有UIパッケージにインストールできます。次のガイドに従ってください: Monorepoセットアップガイド これらのコマンドを実行する前に。
1つのコマンドは、React + Tailwind CSS v4 プロジェクトを設定します。ランタイム依存関係、テーマトークン、グローバルスタイル、 cx 実用性および常にオンの代理店の設計規則。
npx boardui@latest init必要なコンポーネントを追加してください。内部の依存関係とnpmパッケージは自動的に解決されます:
npx boardui@latest add button select date-pickerMCP サーバー
BoardUIはMCPを話します:あなたの代理店を一度接続し、それはすべてをブラウズします 104 コンポーネントと実際の使用例を参照し、プロジェクトをセットアップしてソースファイルを書き込めます。同じチャット内で、ライセンスキーによるProの有効化もできます。
無料版とBoardUI Pro
カラー
文字、背景、境界線、アイコン、チャートの色は、すべて用途に応じたトークンで定義しています。コンポーネント全体の統一感を保ち、ダークモードにも自動的に対応します。アクセントの色階調はCTAと選択状態に使われ、1か所の上書きでブランドカラーに変更できます。
完全なトークン参照タイポグラフィ
Figmaの文字スタイルは、サイズ、太さ、行の高さ、字間をまとめたユーティリティとして提供します。個別の値を組み合わせず、文字スタイルを選ぶだけで設定できます: text-sm font-medium フラグメント。
お問い合わせ Discordで質問する そして、私たちは、通常、同じ日に、オープンで答えます。