カラースキーム生成

ベースカラーを選択して、様々な配色パターンを生成できます。

配色タイプを選択

生成されたカラーパレット（クリックでコピー）

ベースカラー

#4cae4f

rgb(76, 174, 79)

hsl(122, 39%, 49%)

補色

#ae4caa

rgb(174, 76, 170)

hsl(302, 39%, 49%)

ベース明

#91cf93

rgb(145, 207, 147)

hsl(122, 39%, 69%)

ベース暗

#2d672f

rgb(45, 103, 47)

hsl(122, 39%, 29%)

補色明

#cf91cd

rgb(207, 145, 205)

hsl(302, 39%, 69%)

補色暗

#672d65

rgb(103, 45, 101)

hsl(302, 39%, 29%)

エクスポート

:root {
  --color-0: #4cae4f;
  --color-1: #ae4caa;
  --color-2: #91cf93;
  --color-3: #2d672f;
  --color-4: #cf91cd;
  --color-5: #672d65;
}