Benannte Farbe · #465383
Blue Jewel
Blue Jewel ist #465383: rgb(70 83 131), hsl(227 30% 39%), oklch(0.453 0.08 271.4). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Blue mean? → · Blue Jewel color name →
#465383
oklch(0.453 0.08 271.4)
Farbumrechnungen
- HEX
- #465383
- RGB
- rgb(70 83 131)
- HSL
- hsl(227 30% 39%)
- HWB
- hwb(227 27% 49%)
- OKLCH
- oklch(0.453 0.08 271.4)
- OKLab
- oklab(0.453 0.002 -0.08)
- CIE Lab
- lab(35.87 5.31 -29)
- LCH
- lch(35.87 29.49 280.4)
- CMYK
- cmyk(47% 37% 0% 49%)
Tints · Shades · Tones
Tints
- 56638F
- 67739C
- 7984A8
- 8B95B4
- 9DA6C1
- B0B7CD
- C3C9DA
- D7DBE6
- EBEDF2
Shades
- 3C4771
- 323B60
- 28304F
- 1E253F
- 151B2F
- 0D1120
- 050812
- 020206
- 000001
Tones
- 4B5883
- 515C83
- 576183
- 5C6583
- 626A83
- 686E82
- 6E7382
- 747781
- 7A7C81
Farbharmonien
Komplementär +180°
- 465383
Blue Jewel
- 675418
≈ Field Drab
Analog -30° +30°
- 465383
Blue Jewel
- 275B7F
≈ Bahama Blue
- 5E4B7C
≈ Royal Robe
Triadisch +120° +240°
- 465383
Blue Jewel
- 7D443A
≈ Country Sleigh
- 30633F
≈ Fairway Green
Geteilt komplementär +150° +210°
- 465383
Blue Jewel
- 764B23
≈ Vintage Wood
- 4F5D26
≈ Obscure Olive
Tetradisch +90° +180° +270°
- 465383
Blue Jewel
- 7A4253
≈ Red Jade
- 675418
≈ Field Drab
- 046459
≈ Dancing Peacock
Kontrast & Barrierefreiheit
Ag
AAAAuf Weiß
WCAG 7.43:1 · APCA Lc 86
Ag
FailAuf Schwarz
WCAG 2.82:1 · APCA Lc 16
Beste Textfarbe: #FFFFFF
WCAG 7.43:1 (AAA) · APCA Lc 86
Contrast pairs
Code-Snippets
CSS
:root {
--blue-jewel: #465383;
--blue-jewel-rgb: 70 83 131;
--blue-jewel-oklch: oklch(0.453 0.08 271.4);
}
.element {
color: var(--blue-jewel);
background-color: hsl(227 30% 39%);
border-color: oklch(0.453 0.08 271.4);
}Tailwind CSS v4
@theme {
--color-blue-jewel: #465383;
--color-blue-jewel-50: #edf4ff;
--color-blue-jewel-100: #dfe7ff;
--color-blue-jewel-200: #c9d3f8;
--color-blue-jewel-300: #aab5e1;
--color-blue-jewel-400: #8d9ccf;
--color-blue-jewel-500: #7383bc;
--color-blue-jewel-600: #616f9f;
--color-blue-jewel-700: #4e597f;
--color-blue-jewel-800: #37415f;
--color-blue-jewel-900: #262d42;
--color-blue-jewel-950: #141a2b;
}SCSS
$blue-jewel: #465383;
$blue-jewel-rgb: 70, 83, 131;
$blue-jewel-light: mix(#fff, $blue-jewel, 20%);
$blue-jewel-dark: mix(#000, $blue-jewel, 20%);
.element {
color: $blue-jewel;
box-shadow: 0 0 0 2px rgba($blue-jewel, 0.35);
}