Dark Pastel カラーパレット

明るさ

彩度

暖かさ

UI Examples

Explore beautiful UI components with Dark Pastel palette

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

Dark Pastel カラー パレット PNG 画像

Download dark pastel color palette PNG image (landscape)
Download dark pastel color palette PNG image (square)

Dark Pastel カラーパレット CSS

/* CSS */
.color-1 {
color: #698e9b;
}
.color-2 {
color: #b0d4d9;
}
.color-3 {
color: #f1e4e4;
}
.color-4 {
color: #f7d5b6;
}
.color-5 {
color: #e5b4b3;
}

/* CSS Variables */
:root {
--color-1: #698e9b;
 --color-2: #b0d4d9;
 --color-3: #f1e4e4;
 --color-4: #f7d5b6;
 --color-5: #e5b4b3;
 }

Dark Pastel の背景のグラデーション CSS

/* Linear Gradient */
.linear-gradient {
background: linear-gradient(0.25turn, #698e9b, #b0d4d9, #f1e4e4, #f7d5b6, #e5b4b3);
}
/* Radial Gradient */
.radial-gradient {
background: radial-gradient(circle, #698e9b, #b0d4d9, #f1e4e4, #f7d5b6, #e5b4b3);
}

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

Dark Pastel color palette created on .