Vivid Veil カラーパレット

明るさ

彩度

暖かさ

UI Examples

Explore beautiful UI components with Vivid Veil palette

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

Vivid Veil カラー パレット PNG 画像

Download vivid veil color palette PNG image (landscape)
Download vivid veil color palette PNG image (square)

Vivid Veil カラーパレット CSS

/* CSS */
.color-1 {
color: #c2a3e0;
}
.color-2 {
color: #9d6bb8;
}
.color-3 {
color: #6c4b9b;
}
.color-4 {
color: #4e2d7b;
}
.color-5 {
color: #3f1f65;
}

/* CSS Variables */
:root {
--color-1: #c2a3e0;
 --color-2: #9d6bb8;
 --color-3: #6c4b9b;
 --color-4: #4e2d7b;
 --color-5: #3f1f65;
 }

Vivid Veil の背景のグラデーション CSS

/* Linear Gradient */
.linear-gradient {
background: linear-gradient(0.25turn, #c2a3e0, #9d6bb8, #6c4b9b, #4e2d7b, #3f1f65);
}
/* Radial Gradient */
.radial-gradient {
background: radial-gradient(circle, #c2a3e0, #9d6bb8, #6c4b9b, #4e2d7b, #3f1f65);
}

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

Vivid Veil color palette created on .