Raiden Shogun カラーパレット

明るさ

彩度

暖かさ

UI Examples

Explore beautiful UI components with Raiden Shogun palette

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

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

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

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

Download raiden shogun color palette PNG image (landscape)
Download raiden shogun color palette PNG image (square)

Raiden Shogun カラーパレット CSS

/* CSS */
.color-1 {
color: #8e6bb3;
}
.color-2 {
color: #d1a6e2;
}
.color-3 {
color: #f4d7f1;
}
.color-4 {
color: #f7c0d1;
}
.color-5 {
color: #f1a7b4;
}

/* CSS Variables */
:root {
--color-1: #8e6bb3;
 --color-2: #d1a6e2;
 --color-3: #f4d7f1;
 --color-4: #f7c0d1;
 --color-5: #f1a7b4;
 }

Raiden Shogun の背景のグラデーション CSS

/* Linear Gradient */
.linear-gradient {
background: linear-gradient(0.25turn, #8e6bb3, #d1a6e2, #f4d7f1, #f7c0d1, #f1a7b4);
}
/* Radial Gradient */
.radial-gradient {
background: radial-gradient(circle, #8e6bb3, #d1a6e2, #f4d7f1, #f7c0d1, #f1a7b4);
}

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

Raiden Shogun color palette created on .