Gameboy カラーパレット

明るさ

彩度

暖かさ

UI Examples

Explore beautiful UI components with Gameboy palette

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

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

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

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

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

Gameboy カラーパレット CSS

/* CSS */
.color-1 {
color: #7ebd70;
}
.color-2 {
color: #499c5d;
}
.color-3 {
color: #2b7d45;
}
.color-4 {
color: #1f5b40;
}
.color-5 {
color: #1a4c36;
}

/* CSS Variables */
:root {
--color-1: #7ebd70;
 --color-2: #499c5d;
 --color-3: #2b7d45;
 --color-4: #1f5b40;
 --color-5: #1a4c36;
 }

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

/* Linear Gradient */
.linear-gradient {
background: linear-gradient(0.25turn, #7ebd70, #499c5d, #2b7d45, #1f5b40, #1a4c36);
}
/* Radial Gradient */
.radial-gradient {
background: radial-gradient(circle, #7ebd70, #499c5d, #2b7d45, #1f5b40, #1a4c36);
}

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

Gameboy color palette created on .