Lumine カラーパレット

明るさ

彩度

暖かさ

UI Examples

Explore beautiful UI components with Lumine palette

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

Lumine カラー パレット PNG 画像

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

Lumine カラーパレット CSS

/* CSS */
.color-1 {
color: #f9e79f;
}
.color-2 {
color: #fad7a3;
}
.color-3 {
color: #f5b8b2;
}
.color-4 {
color: #d6bce1;
}
.color-5 {
color: #a3c3e0;
}

/* CSS Variables */
:root {
--color-1: #f9e79f;
 --color-2: #fad7a3;
 --color-3: #f5b8b2;
 --color-4: #d6bce1;
 --color-5: #a3c3e0;
 }

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

/* Linear Gradient */
.linear-gradient {
background: linear-gradient(0.25turn, #f9e79f, #fad7a3, #f5b8b2, #d6bce1, #a3c3e0);
}
/* Radial Gradient */
.radial-gradient {
background: radial-gradient(circle, #f9e79f, #fad7a3, #f5b8b2, #d6bce1, #a3c3e0);
}

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

Lumine color palette created on .