Pretzel カラーパレット

明るさ

彩度

暖かさ

UI Examples

Explore beautiful UI components with Pretzel palette

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

Pretzel カラー パレット PNG 画像

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

Pretzel カラーパレット CSS

/* CSS */
.color-1 {
color: #ca7f49;
}
.color-2 {
color: #c26d38;
}
.color-3 {
color: #b75824;
}
.color-4 {
color: #ac4b16;
}
.color-5 {
color: #953b0f;
}

/* CSS Variables */
:root {
--color-1: #ca7f49;
 --color-2: #c26d38;
 --color-3: #b75824;
 --color-4: #ac4b16;
 --color-5: #953b0f;
 }

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

/* Linear Gradient */
.linear-gradient {
background: linear-gradient(0.25turn, #ca7f49, #c26d38, #b75824, #ac4b16, #953b0f);
}
/* Radial Gradient */
.radial-gradient {
background: radial-gradient(circle, #ca7f49, #c26d38, #b75824, #ac4b16, #953b0f);
}

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

Pretzel color palette created on .