Tatsuo Sage カラーパレット

明るさ

彩度

暖かさ

UI Examples

Explore beautiful UI components with Tatsuo Sage palette

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

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

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

Tatsuo Sage カラーパレット CSS

/* CSS */
.color-1 {
color: #a8c2b5;
}
.color-2 {
color: #6a9a7d;
}
.color-3 {
color: #4e7973;
}
.color-4 {
color: #3a5a5a;
}
.color-5 {
color: #2c4e4e;
}

/* CSS Variables */
:root {
--color-1: #a8c2b5;
 --color-2: #6a9a7d;
 --color-3: #4e7973;
 --color-4: #3a5a5a;
 --color-5: #2c4e4e;
 }

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

/* Linear Gradient */
.linear-gradient {
background: linear-gradient(0.25turn, #a8c2b5, #6a9a7d, #4e7973, #3a5a5a, #2c4e4e);
}
/* Radial Gradient */
.radial-gradient {
background: radial-gradient(circle, #a8c2b5, #6a9a7d, #4e7973, #3a5a5a, #2c4e4e);
}

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

Tatsuo Sage color palette created on .