Butter Yellow カラーパレット

明るさ

彩度

暖かさ

UI Examples

Explore beautiful UI components with Butter Yellow palette

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

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

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

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

Download butter yellow color palette PNG image (landscape)
Download butter yellow color palette PNG image (square)

Butter Yellow カラーパレット CSS

/* CSS */
.color-1 {
color: #f6e4a2;
}
.color-2 {
color: #f5d470;
}
.color-3 {
color: #f2c34a;
}
.color-4 {
color: #f2b02c;
}
.color-5 {
color: #f09a19;
}

/* CSS Variables */
:root {
--color-1: #f6e4a2;
 --color-2: #f5d470;
 --color-3: #f2c34a;
 --color-4: #f2b02c;
 --color-5: #f09a19;
 }

Butter Yellow の背景のグラデーション CSS

/* Linear Gradient */
.linear-gradient {
background: linear-gradient(0.25turn, #f6e4a2, #f5d470, #f2c34a, #f2b02c, #f09a19);
}
/* Radial Gradient */
.radial-gradient {
background: radial-gradient(circle, #f6e4a2, #f5d470, #f2c34a, #f2b02c, #f09a19);
}

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

Butter Yellow color palette created on .