QualityHive カラーパレット

明るさ

彩度

暖かさ

UI Examples

Explore beautiful UI components with QualityHive palette

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

QualityHive カラー パレット PNG 画像

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

QualityHive カラーパレット CSS

/* CSS */
.color-1 {
color: #fbe9d5;
}
.color-2 {
color: #fadcc7;
}
.color-3 {
color: #f8cdb9;
}
.color-4 {
color: #f1b8a2;
}
.color-5 {
color: #ebaf94;
}

/* CSS Variables */
:root {
--color-1: #fbe9d5;
 --color-2: #fadcc7;
 --color-3: #f8cdb9;
 --color-4: #f1b8a2;
 --color-5: #ebaf94;
 }

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

/* Linear Gradient */
.linear-gradient {
background: linear-gradient(0.25turn, #fbe9d5, #fadcc7, #f8cdb9, #f1b8a2, #ebaf94);
}
/* Radial Gradient */
.radial-gradient {
background: radial-gradient(circle, #fbe9d5, #fadcc7, #f8cdb9, #f1b8a2, #ebaf94);
}

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

QualityHive color palette created on .