Colt カラーパレット

明るさ

彩度

暖かさ

UI Examples

Explore beautiful UI components with Colt palette

このパレットを共有する先：

Colt カラー パレット PNG 画像

Download colt color palette PNG image (landscape)
Download colt color palette PNG image (square)

Colt カラーパレット CSS

/* CSS */
.color-1 {
color: #a1c2e3;
}
.color-2 {
color: #6a8cb4;
}
.color-3 {
color: #3c6872;
}
.color-4 {
color: #d6b85c;
}
.color-5 {
color: #e95e2f;
}

/* CSS Variables */
:root {
--color-1: #a1c2e3;
 --color-2: #6a8cb4;
 --color-3: #3c6872;
 --color-4: #d6b85c;
 --color-5: #e95e2f;
 }

Colt の背景のグラデーション CSS

/* Linear Gradient */
.linear-gradient {
background: linear-gradient(0.25turn, #a1c2e3, #6a8cb4, #3c6872, #d6b85c, #e95e2f);
}
/* Radial Gradient */
.radial-gradient {
background: radial-gradient(circle, #a1c2e3, #6a8cb4, #3c6872, #d6b85c, #e95e2f);
}

似たようなカラーパレット

Colt color palette created on .