Synthetic Clematis カラーパレット

明るさ

彩度

暖かさ

UI Examples

Explore beautiful UI components with Synthetic Clematis palette

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

Synthetic Clematis カラー パレット PNG 画像

Download synthetic clematis color palette PNG image (landscape)
Download synthetic clematis color palette PNG image (square)

Synthetic Clematis カラーパレット CSS

/* CSS */
.color-1 {
color: #8b96e9;
}
.color-2 {
color: #a27cee;
}
.color-3 {
color: #dca6ed;
}
.color-4 {
color: #f7abe4;
}
.color-5 {
color: #f179d7;
}

/* CSS Variables */
:root {
--color-1: #8b96e9;
 --color-2: #a27cee;
 --color-3: #dca6ed;
 --color-4: #f7abe4;
 --color-5: #f179d7;
 }

Synthetic Clematis の背景のグラデーション CSS

/* Linear Gradient */
.linear-gradient {
background: linear-gradient(0.25turn, #8b96e9, #a27cee, #dca6ed, #f7abe4, #f179d7);
}
/* Radial Gradient */
.radial-gradient {
background: radial-gradient(circle, #8b96e9, #a27cee, #dca6ed, #f7abe4, #f179d7);
}

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

Synthetic Clematis color palette created on .