Nocturnal Elegance カラーパレット

明るさ

彩度

暖かさ

UI Examples

Explore beautiful UI components with Nocturnal Elegance palette

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

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

Download nocturnal elegance color palette PNG image (landscape)
Download nocturnal elegance color palette PNG image (square)

Nocturnal Elegance カラーパレット CSS

/* CSS */
.color-1 {
color: #3e193b;
}
.color-2 {
color: #5a2d62;
}
.color-3 {
color: #7c4384;
}
.color-4 {
color: #ad588d;
}
.color-5 {
color: #cd8ec7;
}

/* CSS Variables */
:root {
--color-1: #3e193b;
 --color-2: #5a2d62;
 --color-3: #7c4384;
 --color-4: #ad588d;
 --color-5: #cd8ec7;
 }

Nocturnal Elegance の背景のグラデーション CSS

/* Linear Gradient */
.linear-gradient {
background: linear-gradient(0.25turn, #3e193b, #5a2d62, #7c4384, #ad588d, #cd8ec7);
}
/* Radial Gradient */
.radial-gradient {
background: radial-gradient(circle, #3e193b, #5a2d62, #7c4384, #ad588d, #cd8ec7);
}

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

Nocturnal Elegance color palette created on .