Deep Twilight カラーパレット

明るさ

彩度

暖かさ

UI Examples

Explore beautiful UI components with Deep Twilight palette

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

Deep Twilight カラー パレット PNG 画像

Download deep twilight color palette PNG image (landscape)
Download deep twilight color palette PNG image (square)

Deep Twilight カラーパレット CSS

/* CSS */
.color-1 {
color: #3d1452;
}
.color-2 {
color: #3c3a64;
}
.color-3 {
color: #3d6a94;
}
.color-4 {
color: #3c73af;
}
.color-5 {
color: #7714c2;
}

/* CSS Variables */
:root {
--color-1: #3d1452;
 --color-2: #3c3a64;
 --color-3: #3d6a94;
 --color-4: #3c73af;
 --color-5: #7714c2;
 }

Deep Twilight の背景のグラデーション CSS

/* Linear Gradient */
.linear-gradient {
background: linear-gradient(0.25turn, #3d1452, #3c3a64, #3d6a94, #3c73af, #7714c2);
}
/* Radial Gradient */
.radial-gradient {
background: radial-gradient(circle, #3d1452, #3c3a64, #3d6a94, #3c73af, #7714c2);
}

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

Deep Twilight color palette created on .