Sage and White カラーパレット

明るさ

彩度

暖かさ

UI Examples

Explore beautiful UI components with Sage and White palette

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

Sage and White カラー パレット PNG 画像

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

Sage and White カラーパレット CSS

/* CSS */
.color-1 {
color: #b0c4a1;
}
.color-2 {
color: #d3e4d5;
}
.color-3 {
color: #f0f4e1;
}
.color-4 {
color: #ffffff;
}
.color-5 {
color: #a4b5a1;
}

/* CSS Variables */
:root {
--color-1: #b0c4a1;
 --color-2: #d3e4d5;
 --color-3: #f0f4e1;
 --color-4: #ffffff;
 --color-5: #a4b5a1;
 }

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

/* Linear Gradient */
.linear-gradient {
background: linear-gradient(0.25turn, #b0c4a1, #d3e4d5, #f0f4e1, #ffffff, #a4b5a1);
}
/* Radial Gradient */
.radial-gradient {
background: radial-gradient(circle, #b0c4a1, #d3e4d5, #f0f4e1, #ffffff, #a4b5a1);
}

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

下にスクロールして5個のセージカラーパレットを探索しましょう

Sage and White color palette created on .