テーマ情報
Apple Human Interface Guidelines に基づいたクリーンなライトテーマ
カラーパレット
Background
#FFFFFF
Surface
#F5F5F7
Primary
#007AFF
Primary Hover
#0051D5
Secondary
#5856D6
Text
#1D1D1F
Text Muted
#86868B
Border
#E5E5EA
Error
#FF3B30
Success
#34C759
Warning
#FF9500
サンプルコンポーネント
ボタン
カード
カードタイトル
テーマカラーに基づいたカードコンポーネントの表示例です。
プライマリカード
プライマリカラーを背景に使用したカードです。
フォーム要素
バッジ
PrimarySecondarySuccessErrorWarning
タイポグラフィ
見出しフォント (Heading)
本文フォント (Base) — The quick brown fox jumps over the lazy dog.
等幅フォント (Mono) — const theme = useTheme()
スペーシング
スペーシング
xs
4px
sm
8px
md
16px
lg
24px
xl
32px
2xl
48px
角丸 (Border Radius)
sm
6px
md
12px
lg
16px
full
9999px