Loading...

Luminary カラーパレット

明るさ

彩度

暖かさ

UI Examples

Explore beautiful UI components with Luminary palette

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

Luminary カラーパレット (PNG) をダウンロード

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

Luminary カラーパレット CSS

/* CSS */
.color-1 {
color: #f4f3f6;
}
.color-2 {
color: #eee6f0;
}
.color-3 {
color: #ecddee;
}
.color-4 {
color: #d7c9e8;
}
.color-5 {
color: #c2c0e8;
}

/* CSS Variables */
:root {
--color-1: #f4f3f6;
 --color-2: #eee6f0;
 --color-3: #ecddee;
 --color-4: #d7c9e8;
 --color-5: #c2c0e8;
 }

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

/* Linear Gradient */
.linear-gradient {
background: linear-gradient(0.25turn, #f4f3f6, #eee6f0, #ecddee, #d7c9e8, #c2c0e8);
}
/* Radial Gradient */
.radial-gradient {
background: radial-gradient(circle, #f4f3f6, #eee6f0, #ecddee, #d7c9e8, #c2c0e8);
}

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

Luminary color palette created on .