設定
8色、モランディ調、変数名の接頭辞は pastel
出力
--pastel-1: #c9b8a8; ...
デザインツール
パステルカラージェネレーター - 柔らかい低彩度パレット
柔らかいパステル調やモランディ風の配色をブラウザ内で生成できます。色数やスタイルを選び、残したい swatch をロックして、チャート、背景、やさしい UI テーマ向けに HEX 一覧や CSS 変数として書き出せます。
パステルパレット色
このツールをお気に入りに
お気に入りの保存方法がまだ選ばれていません。
クイック操作
このツールの URL をコピーするか、対応端末ではシステムの共有シートを開けます。
设计配色
パステルカラージェネレーター
Click generating to harness beautiful low-saturation, high-lightness pastel (Macaron / Morandi) aesthetics suitable for modern background components.
CSS 变量
等待生成调色板。算法思路
Traditional random hex strings produce muddy and stark colors. Pastel algorithms strictly enforce H (0-360 random), S (60-80% saturation), and L (75-90% lightness) in HSL space, then convert explicitly to hex code ensuring safe UI visibility harmony without any design skill prerequisite.
利用シーン
- チャート向けのやわらかい色系列を作る
- 低彩度の背景色やタグ色を生成する
- テーマ用の接頭辞付き CSS 変数を出力する
使い方
- 色数とスタイル（soft、warm、cool、Morandi、mono）を選ぶ
- Generate を押し、残したい swatch をロックする
- HEX 一覧または CSS 変数をコピーする
入出力サンプル
FAQ
色はどのように生成されていますか？
完全ランダムな hex ではなく、高明度・低彩度の範囲に絞った HSL サンプリングで生成しています。
CSS 変数の prefix は変えられますか？
はい。prefix を編集すると、--prefix-1 のような出力名もそれに合わせて更新されます。
ツール
関連ツール
近い用途の翻訳済みツールへ続けて進めます。
パレットジェネレーター
パレットジェネレーター - ルールベースの配色セット
モノクローム、類似色、補色、トライアド、完全ランダムなどのルールで配色を生成できます。個別 swatch をロックし、残りだけ再生成して UI 検討やブランド派生色づくりに使えます。
パレット 色 調和
配色ハーモナイザー
配色ハーモナイザー - 定番配色ルール
基準色を 1 つ選び、complementary、analogous、triadic、tetradic、split-complementary、monochromatic などのルールで配色を生成できます。UI 上で見え方を確認し、brand や component 向けの CSS variable として書き出せます。
Palette Color Harmony
カラーフォーマット変換
カラーフォーマット変換 - HEX、RGB、HSL オンライン
HEX、RGB、HSL、HWB、CMYK、CSS 変数のあいだで色をブラウザ内変換できます。カラーピッカーとランダムカラー補助も備え、デザインの引き継ぎ、スタイルシート作業、ブランドカラー整合に役立ちます。
カラー HEX RGB