Amber Sage カラーパレット

明るさ

彩度

暖かさ

UI Examples

Explore beautiful UI components with Amber Sage palette

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

Amber Sage カラー パレット PNG 画像

Download amber sage color palette PNG image (landscape)
Download amber sage color palette PNG image (square)

Amber Sage カラーパレット CSS

/* CSS */
.color-1 {
color: #bca86c;
}
.color-2 {
color: #d1c96b;
}
.color-3 {
color: #e5d680;
}
.color-4 {
color: #f4e1a4;
}
.color-5 {
color: #f6c8a2;
}

/* CSS Variables */
:root {
--color-1: #bca86c;
 --color-2: #d1c96b;
 --color-3: #e5d680;
 --color-4: #f4e1a4;
 --color-5: #f6c8a2;
 }

Amber Sage の背景のグラデーション CSS

/* Linear Gradient */
.linear-gradient {
background: linear-gradient(0.25turn, #bca86c, #d1c96b, #e5d680, #f4e1a4, #f6c8a2);
}
/* Radial Gradient */
.radial-gradient {
background: radial-gradient(circle, #bca86c, #d1c96b, #e5d680, #f4e1a4, #f6c8a2);
}

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

下にスクロールして8個のアンバーカラーパレットを探索しましょう

Amber Sage color palette created on .