Silent Hill カラーパレット

明るさ

彩度

暖かさ

UI Examples

Explore beautiful UI components with Silent Hill palette

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

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

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

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

Download silent hill color palette PNG image (landscape)
Download silent hill color palette PNG image (square)

Silent Hill カラーパレット CSS

/* CSS */
.color-1 {
color: #6b7c94;
}
.color-2 {
color: #495b69;
}
.color-3 {
color: #3b4c4e;
}
.color-4 {
color: #2d2e2f;
}
.color-5 {
color: #1f2123;
}

/* CSS Variables */
:root {
--color-1: #6b7c94;
 --color-2: #495b69;
 --color-3: #3b4c4e;
 --color-4: #2d2e2f;
 --color-5: #1f2123;
 }

Silent Hill の背景のグラデーション CSS

/* Linear Gradient */
.linear-gradient {
background: linear-gradient(0.25turn, #6b7c94, #495b69, #3b4c4e, #2d2e2f, #1f2123);
}
/* Radial Gradient */
.radial-gradient {
background: radial-gradient(circle, #6b7c94, #495b69, #3b4c4e, #2d2e2f, #1f2123);
}

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

Silent Hill color palette created on .