Meadow Serenity カラーパレット

明るさ

彩度

暖かさ

UI Examples

Explore beautiful UI components with Meadow Serenity palette

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

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

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

Meadow Serenity カラーパレット CSS

/* CSS */
.color-1 {
color: #6b99b8;
}
.color-2 {
color: #e0b97b;
}
.color-3 {
color: #b9d199;
}
.color-4 {
color: #9bd8ee;
}
.color-5 {
color: #ece4b1;
}

/* CSS Variables */
:root {
--color-1: #6b99b8;
 --color-2: #e0b97b;
 --color-3: #b9d199;
 --color-4: #9bd8ee;
 --color-5: #ece4b1;
 }

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

/* Linear Gradient */
.linear-gradient {
background: linear-gradient(0.25turn, #6b99b8, #e0b97b, #b9d199, #9bd8ee, #ece4b1);
}
/* Radial Gradient */
.radial-gradient {
background: radial-gradient(circle, #6b99b8, #e0b97b, #b9d199, #9bd8ee, #ece4b1);
}

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

Meadow Serenity color palette created on .