Caleb Widogast カラーパレット

明るさ

彩度

暖かさ

UI Examples

Explore beautiful UI components with Caleb Widogast palette

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

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

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

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

Download caleb widogast color palette PNG image (landscape)
Download caleb widogast color palette PNG image (square)

Caleb Widogast カラーパレット CSS

/* CSS */
.color-1 {
color: #4c908f;
}
.color-2 {
color: #a7d7d3;
}
.color-3 {
color: #efe6d2;
}
.color-4 {
color: #e8ab7d;
}
.color-5 {
color: #d66e5c;
}

/* CSS Variables */
:root {
--color-1: #4c908f;
 --color-2: #a7d7d3;
 --color-3: #efe6d2;
 --color-4: #e8ab7d;
 --color-5: #d66e5c;
 }

Caleb Widogast の背景のグラデーション CSS

/* Linear Gradient */
.linear-gradient {
background: linear-gradient(0.25turn, #4c908f, #a7d7d3, #efe6d2, #e8ab7d, #d66e5c);
}
/* Radial Gradient */
.radial-gradient {
background: radial-gradient(circle, #4c908f, #a7d7d3, #efe6d2, #e8ab7d, #d66e5c);
}

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

Caleb Widogast color palette created on .