Auburn Hour カラーパレット

明るさ

彩度

暖かさ

UI Examples

Explore beautiful UI components with Auburn Hour palette

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

Auburn Hour カラー パレット PNG 画像

Download auburn hour color palette PNG image (landscape)
Download auburn hour color palette PNG image (square)

Auburn Hour カラーパレット CSS

/* CSS */
.color-1 {
color: #5e2d1c;
}
.color-2 {
color: #8e4b39;
}
.color-3 {
color: #c87651;
}
.color-4 {
color: #f3b49b;
}
.color-5 {
color: #f7e0cf;
}

/* CSS Variables */
:root {
--color-1: #5e2d1c;
 --color-2: #8e4b39;
 --color-3: #c87651;
 --color-4: #f3b49b;
 --color-5: #f7e0cf;
 }

Auburn Hour の背景のグラデーション CSS

/* Linear Gradient */
.linear-gradient {
background: linear-gradient(0.25turn, #5e2d1c, #8e4b39, #c87651, #f3b49b, #f7e0cf);
}
/* Radial Gradient */
.radial-gradient {
background: radial-gradient(circle, #5e2d1c, #8e4b39, #c87651, #f3b49b, #f7e0cf);
}

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

Auburn Hour color palette created on .