Scenekid カラーパレット

明るさ

彩度

暖かさ

UI Examples

Explore beautiful UI components with Scenekid palette

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

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

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

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

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

Scenekid カラーパレット CSS

/* CSS */
.color-1 {
color: #ff6e61;
}
.color-2 {
color: #6c5b80;
}
.color-3 {
color: #88d8b1;
}
.color-4 {
color: #f7b5a1;
}
.color-5 {
color: #ff9d00;
}

/* CSS Variables */
:root {
--color-1: #ff6e61;
 --color-2: #6c5b80;
 --color-3: #88d8b1;
 --color-4: #f7b5a1;
 --color-5: #ff9d00;
 }

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

/* Linear Gradient */
.linear-gradient {
background: linear-gradient(0.25turn, #ff6e61, #6c5b80, #88d8b1, #f7b5a1, #ff9d00);
}
/* Radial Gradient */
.radial-gradient {
background: radial-gradient(circle, #ff6e61, #6c5b80, #88d8b1, #f7b5a1, #ff9d00);
}

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

Scenekid color palette created on .