CSS変数ジェネレーター

カラー・タイポグラフィ・スペーシング・角丸・影をデザイントークンとして生成します。

プリセット:
🎨 カラー
プライマリ
セカンダリ
アクセント
背景
サーフェス
テキスト
テキスト（薄）
ボーダー
T タイポグラフィ
フォントファミリー
基本サイズ
サイズ SM
サイズ LG
サイズ XL
サイズ 2XL
通常ウェイト
太字ウェイト
行の高さ
行の高さ（狭）
↔ スペーシング
XS（極小）
SM（小）
MD（中）
LG（大）
XL（特大）
2XL
3XL
⭘ 角丸（Border Radius）
SM（小）
MD（中）
LG（大）
XL（特大）
Full（丸型）
☉ 影（Shadow）
SM（小）
MD（中）
LG（大）
XL（特大）
ライブプレビュー
生成されたCSS
関連ツール
フリーランス・個人事業主の方へ
デザイン案件の請求書作成・経費管理をシンプルに。freeeなら確定申告まで自動化できます。
freeeを無料で試す

関連ツール

Box Shadow Generator → Box Shadow Generatorツール Css Animation Generator → Css Animation Generatorツール Css Button Generator → Css Button Generatorツール