Disturbance カラーパレット

明るさ

彩度

暖かさ

UI Examples

Explore beautiful UI components with Disturbance palette

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

Disturbance カラー パレット PNG 画像

Download disturbance color palette PNG image (landscape)
Download disturbance color palette PNG image (square)

Disturbance カラーパレット CSS

/* CSS */
.color-1 {
color: #5d4c8a;
}
.color-2 {
color: #8b7cbb;
}
.color-3 {
color: #bea1d9;
}
.color-4 {
color: #f3d6af;
}
.color-5 {
color: #f2a2a1;
}

/* CSS Variables */
:root {
--color-1: #5d4c8a;
 --color-2: #8b7cbb;
 --color-3: #bea1d9;
 --color-4: #f3d6af;
 --color-5: #f2a2a1;
 }

Disturbance の背景のグラデーション CSS

/* Linear Gradient */
.linear-gradient {
background: linear-gradient(0.25turn, #5d4c8a, #8b7cbb, #bea1d9, #f3d6af, #f2a2a1);
}
/* Radial Gradient */
.radial-gradient {
background: radial-gradient(circle, #5d4c8a, #8b7cbb, #bea1d9, #f3d6af, #f2a2a1);
}

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

Disturbance color palette created on .