Sienna and Sage カラーパレット

明るさ

彩度

暖かさ

UI Examples

Explore beautiful UI components with Sienna and Sage palette

カラーインスピレーション

実際のデザインでこのカラーパレットを紹介する画像

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

Sienna and Sage カラーパレット (PNG) をダウンロード

Download sienna and sage color palette PNG image (landscape)
Download sienna and sage color palette PNG image (square)

Sienna and Sage カラーパレット CSS

/* CSS */
.color-1 {
color: #c6996c;
}
.color-2 {
color: #a7beb3;
}
.color-3 {
color: #8d9b7d;
}
.color-4 {
color: #5e7d5e;
}
.color-5 {
color: #d9c4b0;
}

/* CSS Variables */
:root {
--color-1: #c6996c;
 --color-2: #a7beb3;
 --color-3: #8d9b7d;
 --color-4: #5e7d5e;
 --color-5: #d9c4b0;
 }

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

/* Linear Gradient */
.linear-gradient {
background: linear-gradient(0.25turn, #c6996c, #a7beb3, #8d9b7d, #5e7d5e, #d9c4b0);
}
/* Radial Gradient */
.radial-gradient {
background: radial-gradient(circle, #c6996c, #a7beb3, #8d9b7d, #5e7d5e, #d9c4b0);
}

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

Sienna and Sage color palette created on .