Scarred Beauty カラーパレット

明るさ

彩度

暖かさ

UI Examples

Explore beautiful UI components with Scarred Beauty palette

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

Scarred Beauty カラー パレット PNG 画像

Download scarred beauty color palette PNG image (landscape)
Download scarred beauty color palette PNG image (square)

Scarred Beauty カラーパレット CSS

/* CSS */
.color-1 {
color: #e4b5a5;
}
.color-2 {
color: #d18f8f;
}
.color-3 {
color: #b86b6c;
}
.color-4 {
color: #9c4f4f;
}
.color-5 {
color: #7b3232;
}

/* CSS Variables */
:root {
--color-1: #e4b5a5;
 --color-2: #d18f8f;
 --color-3: #b86b6c;
 --color-4: #9c4f4f;
 --color-5: #7b3232;
 }

Scarred Beauty の背景のグラデーション CSS

/* Linear Gradient */
.linear-gradient {
background: linear-gradient(0.25turn, #e4b5a5, #d18f8f, #b86b6c, #9c4f4f, #7b3232);
}
/* Radial Gradient */
.radial-gradient {
background: radial-gradient(circle, #e4b5a5, #d18f8f, #b86b6c, #9c4f4f, #7b3232);
}

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

Scarred Beauty color palette created on .