Rouxls Kaard カラーパレット

明るさ

彩度

暖かさ

UI Examples

Explore beautiful UI components with Rouxls Kaard palette

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

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

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

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

Download rouxls kaard color palette PNG image (landscape)
Download rouxls kaard color palette PNG image (square)

Rouxls Kaard カラーパレット CSS

/* CSS */
.color-1 {
color: #1f2942;
}
.color-2 {
color: #3b4c81;
}
.color-3 {
color: #5a6bba;
}
.color-4 {
color: #9ab3e5;
}
.color-5 {
color: #f5e170;
}

/* CSS Variables */
:root {
--color-1: #1f2942;
 --color-2: #3b4c81;
 --color-3: #5a6bba;
 --color-4: #9ab3e5;
 --color-5: #f5e170;
 }

Rouxls Kaard の背景のグラデーション CSS

/* Linear Gradient */
.linear-gradient {
background: linear-gradient(0.25turn, #1f2942, #3b4c81, #5a6bba, #9ab3e5, #f5e170);
}
/* Radial Gradient */
.radial-gradient {
background: radial-gradient(circle, #1f2942, #3b4c81, #5a6bba, #9ab3e5, #f5e170);
}

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

Rouxls Kaard color palette created on .