Unity in Vibrance カラーパレット

明るさ

彩度

暖かさ

UI Examples

Explore beautiful UI components with Unity in Vibrance palette

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

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

Download unity in vibrance color palette PNG image (landscape)
Download unity in vibrance color palette PNG image (square)

Unity in Vibrance カラーパレット CSS

/* CSS */
.color-1 {
color: #6a2c90;
}
.color-2 {
color: #a85f2e;
}
.color-3 {
color: #eab8c9;
}
.color-4 {
color: #f2d4a6;
}
.color-5 {
color: #3d8c8f;
}

/* CSS Variables */
:root {
--color-1: #6a2c90;
 --color-2: #a85f2e;
 --color-3: #eab8c9;
 --color-4: #f2d4a6;
 --color-5: #3d8c8f;
 }

Unity in Vibrance の背景のグラデーション CSS

/* Linear Gradient */
.linear-gradient {
background: linear-gradient(0.25turn, #6a2c90, #a85f2e, #eab8c9, #f2d4a6, #3d8c8f);
}
/* Radial Gradient */
.radial-gradient {
background: radial-gradient(circle, #6a2c90, #a85f2e, #eab8c9, #f2d4a6, #3d8c8f);
}

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

Unity in Vibrance color palette created on .