Tabby カラーパレット

明るさ

彩度

暖かさ

UI Examples

Explore beautiful UI components with Tabby palette

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

Tabby カラー パレット PNG 画像

Download tabby color palette PNG image (landscape)
Download tabby color palette PNG image (square)

Tabby カラーパレット CSS

/* CSS */
.color-1 {
color: #d9b76d;
}
.color-2 {
color: #c0a18c;
}
.color-3 {
color: #a97076;
}
.color-4 {
color: #e8c4a1;
}
.color-5 {
color: #f7e1b6;
}

/* CSS Variables */
:root {
--color-1: #d9b76d;
 --color-2: #c0a18c;
 --color-3: #a97076;
 --color-4: #e8c4a1;
 --color-5: #f7e1b6;
 }

Tabby の背景のグラデーション CSS

/* Linear Gradient */
.linear-gradient {
background: linear-gradient(0.25turn, #d9b76d, #c0a18c, #a97076, #e8c4a1, #f7e1b6);
}
/* Radial Gradient */
.radial-gradient {
background: radial-gradient(circle, #d9b76d, #c0a18c, #a97076, #e8c4a1, #f7e1b6);
}

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

Tabby color palette created on .