Earthy Brown カラーパレット

明るさ

彩度

暖かさ

UI Examples

Explore beautiful UI components with Earthy Brown palette

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

Earthy Brown カラーパレット (PNG) をダウンロード

Download earthy brown color palette PNG image (landscape)
Download earthy brown color palette PNG image (square)

Earthy Brown カラーパレット CSS

/* CSS */
.color-1 {
color: #7e5c3e;
}
.color-2 {
color: #c6a65d;
}
.color-3 {
color: #e2c88d;
}
.color-4 {
color: #f0d7b2;
}
.color-5 {
color: #f7e1c0;
}

/* CSS Variables */
:root {
--color-1: #7e5c3e;
 --color-2: #c6a65d;
 --color-3: #e2c88d;
 --color-4: #f0d7b2;
 --color-5: #f7e1c0;
 }

Earthy Brown の背景のグラデーション CSS

/* Linear Gradient */
.linear-gradient {
background: linear-gradient(0.25turn, #7e5c3e, #c6a65d, #e2c88d, #f0d7b2, #f7e1c0);
}
/* Radial Gradient */
.radial-gradient {
background: radial-gradient(circle, #7e5c3e, #c6a65d, #e2c88d, #f0d7b2, #f7e1c0);
}

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

Earthy Brown color palette created on .