☾
Light
カスタムカラーシステム
9色のパレットをRGBスライダーで自由に調整。和名も定義できます。
→
戻す
確定
Border
太さ
px
スタイル
solid
dashed
dotted
double
none
Typography
フォント
サイズ
px
ウェイト
パレット選択
palette-1
--color-bg — 背景色
RGB
HSL
和名
Typography
▾
本文
コード
🔍 インストール済みフォントを検出
Sans (本文)
The quick brown fox ゲシュタルト 色彩 1234567890
Mono (コード)
const color = "#5B5BD6"; // accent
Scales
▾
Method
Brightness
Warm
Cool
Hue
Light
Dark
Tints
Shades
Chroma
Multi-Channel
Steps
−
+
Amount
−
+
Color scale
CSS
[ ]
適用
Sub Colors
▾
近い伝統色
仮パレット
— Sub Colorsから配置・クリックでコピー
Key
+
Sub
+
Accent
+
Live Preview
Live Preview — 伝統色ブラウザ上にフロート中
Live Preview
My App
Dashboard
Settings
Profile
カスタムテーマ
テキスト・背景・アクセント色を確認
カード見出し
補助テキストの見え方
Accent
Success
Warning
Error
Info
アクション
tertiary — 補助テキスト
disabled — 無効テキスト
Pie Menu Preview
Palette Roles
▾
色
Role
和名
⚙
アクセシビリティ診断
—
伝統色ブラウザ
621色
✕
適用