Beetlejuice カラーパレット

明るさ

彩度

暖かさ

UI Examples

Explore beautiful UI components with Beetlejuice palette

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

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

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

Beetlejuice カラーパレット CSS

/* CSS */
.color-1 {
color: #1f1f1f;
}
.color-2 {
color: #4f4f4f;
}
.color-3 {
color: #808080;
}
.color-4 {
color: #a1c9a1;
}
.color-5 {
color: #c8e0c8;
}

/* CSS Variables */
:root {
--color-1: #1f1f1f;
 --color-2: #4f4f4f;
 --color-3: #808080;
 --color-4: #a1c9a1;
 --color-5: #c8e0c8;
 }

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

/* Linear Gradient */
.linear-gradient {
background: linear-gradient(0.25turn, #1f1f1f, #4f4f4f, #808080, #a1c9a1, #c8e0c8);
}
/* Radial Gradient */
.radial-gradient {
background: radial-gradient(circle, #1f1f1f, #4f4f4f, #808080, #a1c9a1, #c8e0c8);
}

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

Beetlejuice color palette created on .