Midnight Royalty カラーパレット

明るさ

彩度

暖かさ

UI Examples

Explore beautiful UI components with Midnight Royalty palette

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

Midnight Royalty カラー パレット PNG 画像

Download midnight royalty color palette PNG image (landscape)
Download midnight royalty color palette PNG image (square)

Midnight Royalty カラーパレット CSS

/* CSS */
.color-1 {
color: #000000;
}
.color-2 {
color: #b7860b;
}
.color-3 {
color: #5e4b8b;
}
.color-4 {
color: #d2c94b;
}
.color-5 {
color: #7d4c9a;
}

/* CSS Variables */
:root {
--color-1: #000000;
 --color-2: #b7860b;
 --color-3: #5e4b8b;
 --color-4: #d2c94b;
 --color-5: #7d4c9a;
 }

Midnight Royalty の背景のグラデーション CSS

/* Linear Gradient */
.linear-gradient {
background: linear-gradient(0.25turn, #000000, #b7860b, #5e4b8b, #d2c94b, #7d4c9a);
}
/* Radial Gradient */
.radial-gradient {
background: radial-gradient(circle, #000000, #b7860b, #5e4b8b, #d2c94b, #7d4c9a);
}

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

Midnight Royalty color palette created on .