Ginga UI

LLMを活用したテーマ生成機能を持つReact UIコンポーネントライブラリ

特徴

🎨 AIテーマ生成

プロンプトから自動的にCSS変数を生成。OpenAI、Gemini、Anthropicの3つのLLMプロバイダーをサポート。

♿ アクセシビリティ

React Aria Componentsをベースに構築され、キーボード操作、スクリーンリーダー、フォーカス管理に完全対応。

⚡ Next.js対応

App Routerに最適化。サーバーコンポーネントでのテーマ生成により、高速な初期表示を実現。

🎯 型安全

TypeScript strictモードで実装。Zodスキーマによるランタイム検証で、AIが生成するテーマも型安全。

🎨 CSS変数ベース

テーマはCSS変数で管理。既存のスタイルシステムとの統合が容易で、カスタマイズも自由自在。

📦 19個のコンポーネント

フォーム、レイアウト、表示、ナビゲーション、タイポグラフィの5カテゴリで充実したコンポーネント群。

はじめ方

Ginga UIを使い始めるのは簡単です。パッケージをインストールして、コンポーネントをインポートするだけ。

詳しい手順はクイックスタートをご覧ください。