King Arthur カラーパレット

明るさ

彩度

暖かさ

UI Examples

Explore beautiful UI components with King Arthur palette

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

King Arthur カラー パレット PNG 画像

Download king arthur color palette PNG image (landscape)
Download king arthur color palette PNG image (square)

King Arthur カラーパレット CSS

/* CSS */
.color-1 {
color: #4b5d7c;
}
.color-2 {
color: #7386a5;
}
.color-3 {
color: #9cb3d3;
}
.color-4 {
color: #f2d15a;
}
.color-5 {
color: #e57e2e;
}

/* CSS Variables */
:root {
--color-1: #4b5d7c;
 --color-2: #7386a5;
 --color-3: #9cb3d3;
 --color-4: #f2d15a;
 --color-5: #e57e2e;
 }

King Arthur の背景のグラデーション CSS

/* Linear Gradient */
.linear-gradient {
background: linear-gradient(0.25turn, #4b5d7c, #7386a5, #9cb3d3, #f2d15a, #e57e2e);
}
/* Radial Gradient */
.radial-gradient {
background: radial-gradient(circle, #4b5d7c, #7386a5, #9cb3d3, #f2d15a, #e57e2e);
}

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

King Arthur color palette created on .