Diamond カラーパレット

明るさ

彩度

暖かさ

UI Examples

Explore beautiful UI components with Diamond palette

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

Diamond カラー パレット PNG 画像

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

Diamond カラーパレット CSS

/* CSS */
.color-1 {
color: #a7c6e7;
}
.color-2 {
color: #b3e4f4;
}
.color-3 {
color: #f2e5b0;
}
.color-4 {
color: #f1c6d3;
}
.color-5 {
color: #e7b1d1;
}

/* CSS Variables */
:root {
--color-1: #a7c6e7;
 --color-2: #b3e4f4;
 --color-3: #f2e5b0;
 --color-4: #f1c6d3;
 --color-5: #e7b1d1;
 }

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

/* Linear Gradient */
.linear-gradient {
background: linear-gradient(0.25turn, #a7c6e7, #b3e4f4, #f2e5b0, #f1c6d3, #e7b1d1);
}
/* Radial Gradient */
.radial-gradient {
background: radial-gradient(circle, #a7c6e7, #b3e4f4, #f2e5b0, #f1c6d3, #e7b1d1);
}

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

Diamond color palette created on .