Blue Ridge Serenity カラーパレット

明るさ

彩度

暖かさ

UI Examples

Explore beautiful UI components with Blue Ridge Serenity palette

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

Blue Ridge Serenity カラー パレット PNG 画像

Download blue ridge serenity color palette PNG image (landscape)
Download blue ridge serenity color palette PNG image (square)

Blue Ridge Serenity カラーパレット CSS

/* CSS */
.color-1 {
color: #4a7cba;
}
.color-2 {
color: #5d9cbb;
}
.color-3 {
color: #82c2d4;
}
.color-4 {
color: #b7e1e6;
}
.color-5 {
color: #e0f7fa;
}

/* CSS Variables */
:root {
--color-1: #4a7cba;
 --color-2: #5d9cbb;
 --color-3: #82c2d4;
 --color-4: #b7e1e6;
 --color-5: #e0f7fa;
 }

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

/* Linear Gradient */
.linear-gradient {
background: linear-gradient(0.25turn, #4a7cba, #5d9cbb, #82c2d4, #b7e1e6, #e0f7fa);
}
/* Radial Gradient */
.radial-gradient {
background: radial-gradient(circle, #4a7cba, #5d9cbb, #82c2d4, #b7e1e6, #e0f7fa);
}

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

下にスクロールして1個の青カラーパレットを探索しましょう

Blue Ridge Serenity color palette created on .