Metallic Harmony カラーパレット

明るさ

彩度

暖かさ

UI Examples

Explore beautiful UI components with Metallic Harmony palette

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

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

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

Metallic Harmony カラーパレット CSS

/* CSS */
.color-1 {
color: #2c3329;
}
.color-2 {
color: #494e46;
}
.color-3 {
color: #7b7f76;
}
.color-4 {
color: #b6b7a4;
}
.color-5 {
color: #eae3d7;
}

/* CSS Variables */
:root {
--color-1: #2c3329;
 --color-2: #494e46;
 --color-3: #7b7f76;
 --color-4: #b6b7a4;
 --color-5: #eae3d7;
 }

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

/* Linear Gradient */
.linear-gradient {
background: linear-gradient(0.25turn, #2c3329, #494e46, #7b7f76, #b6b7a4, #eae3d7);
}
/* Radial Gradient */
.radial-gradient {
background: radial-gradient(circle, #2c3329, #494e46, #7b7f76, #b6b7a4, #eae3d7);
}

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

Metallic Harmony color palette created on .