Melrose Dream カラーパレット

明るさ

彩度

暖かさ

UI Examples

Explore beautiful UI components with Melrose Dream palette

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

Melrose Dream カラー パレット PNG 画像

Download melrose dream color palette PNG image (landscape)
Download melrose dream color palette PNG image (square)

Melrose Dream カラーパレット CSS

/* CSS */
.color-1 {
color: #cac9ee;
}
.color-2 {
color: #a6aae7;
}
.color-3 {
color: #8b8de4;
}
.color-4 {
color: #6a76e2;
}
.color-5 {
color: #545bde;
}

/* CSS Variables */
:root {
--color-1: #cac9ee;
 --color-2: #a6aae7;
 --color-3: #8b8de4;
 --color-4: #6a76e2;
 --color-5: #545bde;
 }

Melrose Dream の背景のグラデーション CSS

/* Linear Gradient */
.linear-gradient {
background: linear-gradient(0.25turn, #cac9ee, #a6aae7, #8b8de4, #6a76e2, #545bde);
}
/* Radial Gradient */
.radial-gradient {
background: radial-gradient(circle, #cac9ee, #a6aae7, #8b8de4, #6a76e2, #545bde);
}

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

Melrose Dream color palette created on .