Whimsical Webs カラーパレット

明るさ

彩度

暖かさ

UI Examples

Explore beautiful UI components with Whimsical Webs palette

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

Whimsical Webs カラー パレット PNG 画像

Download whimsical webs color palette PNG image (landscape)
Download whimsical webs color palette PNG image (square)

Whimsical Webs カラーパレット CSS

/* CSS */
.color-1 {
color: #e6b1f6;
}
.color-2 {
color: #f7a1cf;
}
.color-3 {
color: #f9c5a9;
}
.color-4 {
color: #f4ddb4;
}
.color-5 {
color: #c7e6b7;
}

/* CSS Variables */
:root {
--color-1: #e6b1f6;
 --color-2: #f7a1cf;
 --color-3: #f9c5a9;
 --color-4: #f4ddb4;
 --color-5: #c7e6b7;
 }

Whimsical Webs の背景のグラデーション CSS

/* Linear Gradient */
.linear-gradient {
background: linear-gradient(0.25turn, #e6b1f6, #f7a1cf, #f9c5a9, #f4ddb4, #c7e6b7);
}
/* Radial Gradient */
.radial-gradient {
background: radial-gradient(circle, #e6b1f6, #f7a1cf, #f9c5a9, #f4ddb4, #c7e6b7);
}

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

Whimsical Webs color palette created on .