Mercury Shades カラーパレット

明るさ

彩度

暖かさ

UI Examples

Explore beautiful UI components with Mercury Shades palette

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

Mercury Shades カラー パレット PNG 画像

Download mercury shades color palette PNG image (landscape)
Download mercury shades color palette PNG image (square)

Mercury Shades カラーパレット CSS

/* CSS */
.color-1 {
color: #d9d9d9;
}
.color-2 {
color: #a6a6a6;
}
.color-3 {
color: #7d7d7d;
}
.color-4 {
color: #3d3d3d;
}
.color-5 {
color: #1a1a1a;
}

/* CSS Variables */
:root {
--color-1: #d9d9d9;
 --color-2: #a6a6a6;
 --color-3: #7d7d7d;
 --color-4: #3d3d3d;
 --color-5: #1a1a1a;
 }

Mercury Shades の背景のグラデーション CSS

/* Linear Gradient */
.linear-gradient {
background: linear-gradient(0.25turn, #d9d9d9, #a6a6a6, #7d7d7d, #3d3d3d, #1a1a1a);
}
/* Radial Gradient */
.radial-gradient {
background: radial-gradient(circle, #d9d9d9, #a6a6a6, #7d7d7d, #3d3d3d, #1a1a1a);
}

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

Mercury Shades color palette created on .