Void with Vibrance カラーパレット

明るさ

彩度

暖かさ

UI Examples

Explore beautiful UI components with Void with Vibrance palette

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

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

Download void with vibrance color palette PNG image (landscape)
Download void with vibrance color palette PNG image (square)

Void with Vibrance カラーパレット CSS

/* CSS */
.color-1 {
color: #1b1b2d;
}
.color-2 {
color: #2b2b73;
}
.color-3 {
color: #690571;
}
.color-4 {
color: #a8008f;
}
.color-5 {
color: #ff5f57;
}

/* CSS Variables */
:root {
--color-1: #1b1b2d;
 --color-2: #2b2b73;
 --color-3: #690571;
 --color-4: #a8008f;
 --color-5: #ff5f57;
 }

Void with Vibrance の背景のグラデーション CSS

/* Linear Gradient */
.linear-gradient {
background: linear-gradient(0.25turn, #1b1b2d, #2b2b73, #690571, #a8008f, #ff5f57);
}
/* Radial Gradient */
.radial-gradient {
background: radial-gradient(circle, #1b1b2d, #2b2b73, #690571, #a8008f, #ff5f57);
}

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

Void with Vibrance color palette created on .