Eleanor カラーパレット

明るさ

彩度

暖かさ

UI Examples

Explore beautiful UI components with Eleanor palette

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

Eleanor カラー パレット PNG 画像

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

Eleanor カラーパレット CSS

/* CSS */
.color-1 {
color: #e6b7d7;
}
.color-2 {
color: #d48cc6;
}
.color-3 {
color: #a680c2;
}
.color-4 {
color: #895ea1;
}
.color-5 {
color: #5a3e8e;
}

/* CSS Variables */
:root {
--color-1: #e6b7d7;
 --color-2: #d48cc6;
 --color-3: #a680c2;
 --color-4: #895ea1;
 --color-5: #5a3e8e;
 }

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

/* Linear Gradient */
.linear-gradient {
background: linear-gradient(0.25turn, #e6b7d7, #d48cc6, #a680c2, #895ea1, #5a3e8e);
}
/* Radial Gradient */
.radial-gradient {
background: radial-gradient(circle, #e6b7d7, #d48cc6, #a680c2, #895ea1, #5a3e8e);
}

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

Eleanor color palette created on .