色名 · #0F63B3
Les Cavaliers Beach
Les Cavaliers Beachは#0F63B3：rgb(15 99 179)、hsl(209 85% 38%)、oklch(0.499 0.147 253.1)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Blue mean? → · Les Cavaliers Beach color name →
#0F63B3
oklch(0.499 0.147 253.1)
カラー変換
- HEX
- #0f63b3
- RGB
- rgb(15 99 179)
- HSL
- hsl(209 85% 38%)
- HWB
- hwb(209 6% 30%)
- OKLCH
- oklch(0.499 0.147 253.1)
- OKLab
- oklab(0.499 -0.043 -0.14)
- CIE Lab
- lab(40.87 0.72 -49.91)
- LCH
- lch(40.87 49.91 270.8)
- CMYK
- cmyk(92% 45% 0% 30%)
ティント · シェード · トーン
ティント
- 3073BC
- 4983C4
- 6092CC
- 77A1D4
- 8DB1DC
- A3C0E3
- BAD0EA
- D1E0F1
- E8EFF8
シェード
- 0B559B
- 084784
- 053A6E
- 032E58
- 022143
- 01162F
- 000B1D
- 00030C
- 000001
トーン
- 2367AF
- 316AAA
- 3D6EA5
- 4871A0
- 52749B
- 5C7796
- 657991
- 6E7C8C
- 777E86
カラーハーモニー
補色 +180°
- 0F63B3
Les Cavaliers Beach
- 875800
≈ Spear Shaft
類似色 -30° +30°
- 0F63B3
Les Cavaliers Beach
- 006E89
≈ Private Eye
- 5A53B2
≈ Brandywine Raspberry
トライアド +120° +240°
- 0F63B3
Les Cavaliers Beach
- A5354A
≈ Scarlet Ribbons
- 407300
≈ Tropicana
スプリットコンプリメンタリー +150° +210°
- 0F63B3
Les Cavaliers Beach
- A43E02
≈ Rust
- 6E6500
≈ Spicy Mustard
テトラード +90° +180° +270°
- 0F63B3
Les Cavaliers Beach
- 983978
≈ Purple Wine
- 875800
≈ Spear Shaft
- 007551
≈ Lush Meadow
コントラストとアクセシビリティ
Ag
AA白の上
WCAG 6.07:1 · APCA Lc 80
Ag
Fail黒の上
WCAG 3.45:1 · APCA Lc 22
最適な文字色: #FFFFFF
WCAG 6.07:1 (AA) · APCA Lc 80
Contrast pairs
コードスニペット
CSS
:root {
--les-cavaliers-beach: #0f63b3;
--les-cavaliers-beach-rgb: 15 99 179;
--les-cavaliers-beach-oklch: oklch(0.499 0.147 253.1);
}
.element {
color: var(--les-cavaliers-beach);
background-color: hsl(209 85% 38%);
border-color: oklch(0.499 0.147 253.1);
}Tailwind CSS v4
@theme {
--color-les-cavaliers-beach: #0f63b3;
--color-les-cavaliers-beach-50: #daf8ff;
--color-les-cavaliers-beach-100: #c8ebff;
--color-les-cavaliers-beach-200: #aad8ff;
--color-les-cavaliers-beach-300: #83baff;
--color-les-cavaliers-beach-400: #5ba2f2;
--color-les-cavaliers-beach-500: #3188e4;
--color-les-cavaliers-beach-600: #2b73c0;
--color-les-cavaliers-beach-700: #225c9a;
--color-les-cavaliers-beach-800: #134473;
--color-les-cavaliers-beach-900: #0c2f51;
--color-les-cavaliers-beach-950: #011b36;
}SCSS
$les-cavaliers-beach: #0f63b3;
$les-cavaliers-beach-rgb: 15, 99, 179;
$les-cavaliers-beach-light: mix(#fff, $les-cavaliers-beach, 20%);
$les-cavaliers-beach-dark: mix(#000, $les-cavaliers-beach, 20%);
.element {
color: $les-cavaliers-beach;
box-shadow: 0 0 0 2px rgba($les-cavaliers-beach, 0.35);
}