Fizzarolli カラーパレット

明るさ

彩度

暖かさ

UI Examples

Explore beautiful UI components with Fizzarolli palette

カラーインスピレーション

実際のデザインでこのカラーパレットを紹介する画像

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

Fizzarolli カラーパレット (PNG) をダウンロード

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

Fizzarolli カラーパレット CSS

/* CSS */
.color-1 {
color: #ff8457;
}
.color-2 {
color: #ffba52;
}
.color-3 {
color: #ffe785;
}
.color-4 {
color: #85d5fa;
}
.color-5 {
color: #6ab7f6;
}

/* CSS Variables */
:root {
--color-1: #ff8457;
 --color-2: #ffba52;
 --color-3: #ffe785;
 --color-4: #85d5fa;
 --color-5: #6ab7f6;
 }

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

/* Linear Gradient */
.linear-gradient {
background: linear-gradient(0.25turn, #ff8457, #ffba52, #ffe785, #85d5fa, #6ab7f6);
}
/* Radial Gradient */
.radial-gradient {
background: radial-gradient(circle, #ff8457, #ffba52, #ffe785, #85d5fa, #6ab7f6);
}

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

Fizzarolli color palette created on .