Design System

Stella UI

ウェブ向けのスケーラブルなデザインシステム。
25 のアクセシブルなコンポーネント。天体をベースにしたデザイントークン。

はじめる →コンポーネント一覧

インストール

npm install @stella-ds/react @stella-ds/theme

⚡

25 コンポーネント

ボタン、フォーム、オーバーレイ、レイアウトなど豊富なコンポーネント

♿

アクセシブル

Radix UI プリミティブ上に構築、全体に ARIA 対応

🎨

デザイントークン

天体をテーマにしたカラーパレットと CSS カスタムプロパティ

🤖

AI 対応

llms.txt と MCP サーバーでシームレスな AI 統合

クイックスタート

設定も簡単

テーマをインポートして CSS 変数をいれて、あとはコンポーネントを使うだけ。

import '@stella-ds/theme/css'
import { Button, Input, Card, CardContent } from '@stella-ds/react'

export default function App() {
  return (
    <Card>
      <CardContent>
        <Input placeholder="メールアドレス" />
        <Button variant="solid">登録する</Button>
      </CardContent>
    </Card>
  )
}