Eclipse カラーパレット

明るさ

彩度

暖かさ

UI Examples

Explore beautiful UI components with Eclipse palette

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

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

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

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

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

Eclipse カラーパレット CSS

/* CSS */
.color-1 {
color: #1a0c2c;
}
.color-2 {
color: #5b4d89;
}
.color-3 {
color: #907099;
}
.color-4 {
color: #dab9c2;
}
.color-5 {
color: #f8d8a0;
}

/* CSS Variables */
:root {
--color-1: #1a0c2c;
 --color-2: #5b4d89;
 --color-3: #907099;
 --color-4: #dab9c2;
 --color-5: #f8d8a0;
 }

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

/* Linear Gradient */
.linear-gradient {
background: linear-gradient(0.25turn, #1a0c2c, #5b4d89, #907099, #dab9c2, #f8d8a0);
}
/* Radial Gradient */
.radial-gradient {
background: radial-gradient(circle, #1a0c2c, #5b4d89, #907099, #dab9c2, #f8d8a0);
}

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

Eclipse color palette created on .