Metallic Blue カラーパレット

明るさ

彩度

暖かさ

UI Examples

Explore beautiful UI components with Metallic Blue palette

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

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

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

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

Download metallic blue color palette PNG image (landscape)
Download metallic blue color palette PNG image (square)

Metallic Blue カラーパレット CSS

/* CSS */
.color-1 {
color: #1a3f8e;
}
.color-2 {
color: #496a9c;
}
.color-3 {
color: #7a9ab8;
}
.color-4 {
color: #b2c3d7;
}
.color-5 {
color: #e0e7f5;
}

/* CSS Variables */
:root {
--color-1: #1a3f8e;
 --color-2: #496a9c;
 --color-3: #7a9ab8;
 --color-4: #b2c3d7;
 --color-5: #e0e7f5;
 }

Metallic Blue の背景のグラデーション CSS

/* Linear Gradient */
.linear-gradient {
background: linear-gradient(0.25turn, #1a3f8e, #496a9c, #7a9ab8, #b2c3d7, #e0e7f5);
}
/* Radial Gradient */
.radial-gradient {
background: radial-gradient(circle, #1a3f8e, #496a9c, #7a9ab8, #b2c3d7, #e0e7f5);
}

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

Metallic Blue color palette created on .