Sunday Serenity カラーパレット

明るさ

彩度

暖かさ

UI Examples

Explore beautiful UI components with Sunday Serenity palette

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

Sunday Serenity カラー パレット PNG 画像

Download sunday serenity color palette PNG image (landscape)
Download sunday serenity color palette PNG image (square)

Sunday Serenity カラーパレット CSS

/* CSS */
.color-1 {
color: #2e2a5a;
}
.color-2 {
color: #4a4e8c;
}
.color-3 {
color: #707ebd;
}
.color-4 {
color: #b3a0d4;
}
.color-5 {
color: #f9d09f;
}

/* CSS Variables */
:root {
--color-1: #2e2a5a;
 --color-2: #4a4e8c;
 --color-3: #707ebd;
 --color-4: #b3a0d4;
 --color-5: #f9d09f;
 }

Sunday Serenity の背景のグラデーション CSS

/* Linear Gradient */
.linear-gradient {
background: linear-gradient(0.25turn, #2e2a5a, #4a4e8c, #707ebd, #b3a0d4, #f9d09f);
}
/* Radial Gradient */
.radial-gradient {
background: radial-gradient(circle, #2e2a5a, #4a4e8c, #707ebd, #b3a0d4, #f9d09f);
}

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

Sunday Serenity color palette created on .