Treasure Chest カラーパレット

明るさ

彩度

暖かさ

UI Examples

Explore beautiful UI components with Treasure Chest palette

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

Treasure Chest カラー パレット PNG 画像

Download treasure chest color palette PNG image (landscape)
Download treasure chest color palette PNG image (square)

Treasure Chest カラーパレット CSS

/* CSS */
.color-1 {
color: #f3e4aa;
}
.color-2 {
color: #f3b96d;
}
.color-3 {
color: #f4753e;
}
.color-4 {
color: #c8524c;
}
.color-5 {
color: #7e2a66;
}

/* CSS Variables */
:root {
--color-1: #f3e4aa;
 --color-2: #f3b96d;
 --color-3: #f4753e;
 --color-4: #c8524c;
 --color-5: #7e2a66;
 }

Treasure Chest の背景のグラデーション CSS

/* Linear Gradient */
.linear-gradient {
background: linear-gradient(0.25turn, #f3e4aa, #f3b96d, #f4753e, #c8524c, #7e2a66);
}
/* Radial Gradient */
.radial-gradient {
background: radial-gradient(circle, #f3e4aa, #f3b96d, #f4753e, #c8524c, #7e2a66);
}

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

Treasure Chest color palette created on .