Verdant Harmony カラーパレット

明るさ

彩度

暖かさ

UI Examples

Explore beautiful UI components with Verdant Harmony palette

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

Verdant Harmony カラー パレット PNG 画像

Download verdant harmony color palette PNG image (landscape)
Download verdant harmony color palette PNG image (square)

Verdant Harmony カラーパレット CSS

/* CSS */
.color-1 {
color: #1e381e;
}
.color-2 {
color: #3a5f3a;
}
.color-3 {
color: #5a7c5a;
}
.color-4 {
color: #83b483;
}
.color-5 {
color: #a7d3a7;
}

/* CSS Variables */
:root {
--color-1: #1e381e;
 --color-2: #3a5f3a;
 --color-3: #5a7c5a;
 --color-4: #83b483;
 --color-5: #a7d3a7;
 }

Verdant Harmony の背景のグラデーション CSS

/* Linear Gradient */
.linear-gradient {
background: linear-gradient(0.25turn, #1e381e, #3a5f3a, #5a7c5a, #83b483, #a7d3a7);
}
/* Radial Gradient */
.radial-gradient {
background: radial-gradient(circle, #1e381e, #3a5f3a, #5a7c5a, #83b483, #a7d3a7);
}

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

Verdant Harmony color palette created on .