Nächste benannte Farbe · #0025AF
#0025AF
Nächste benannte Farbe: Sapphire Splendour
#0025AF (rgb(0 37 175), hsl(227 100% 34%), oklch(0.372 0.215 264)) liegt am nächsten an der benannten Farbe Sapphire Splendour. Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
#0025AF
oklch(0.372 0.215 264)
Farbumrechnungen
- HEX
- #0025af
- RGB
- rgb(0 37 175)
- HSL
- hsl(227 100% 34%)
- HWB
- hwb(227 0% 31%)
- OKLCH
- oklch(0.372 0.215 264)
- OKLab
- oklab(0.372 -0.023 -0.214)
- CIE Lab
- lab(23.42 37.12 -76.02)
- LCH
- lch(23.42 84.6 296)
- CMYK
- cmyk(100% 79% 0% 31%)
Tints · Shades · Tones
Tints
- 1542B9
- 2E5AC3
- 4670CC
- 5F85D5
- 7899DD
- 92ADE5
- ACC2EC
- C7D6F3
- E3EBF9
Shades
- 001F98
- 001981
- 00136B
- 000D56
- 000841
- 00042E
- 00021C
- 00000B
- 000001
Tones
- 0A35AC
- 1841A8
- 264BA4
- 3354A0
- 405D9C
- 4C6597
- 596C92
- 66738D
- 737A87
Farbharmonien
Komplementär +180°
- 0025AF
Sapphire Splendour
- 533C00
≈ Pineapple
Analog -30° +30°
- 0025AF
Sapphire Splendour
- 004663
≈ Forest Blues
- 4D009F
≈ Space Battle Blue
Triadisch +120° +240°
- 0025AF
Sapphire Splendour
- 7D0013
≈ Mythical Wine
- 004F0A
≈ Malachite Green
Geteilt komplementär +150° +210°
- 0025AF
Sapphire Splendour
- 653000
≈ Beasty Brown
- 404500
≈ Green Not Found
Tetradisch +90° +180° +270°
- 0025AF
Sapphire Splendour
- 770046
≈ Dawn of the Fairies
- 533C00
≈ Pineapple
- 004C3D
≈ Aqua Deep
Kontrast & Barrierefreiheit
Ag
AAAAuf Weiß
WCAG 11.14:1 · APCA Lc 94
Ag
FailAuf Schwarz
WCAG 1.88:1 · APCA Lc 8
Beste Textfarbe: #FFFFFF
WCAG 11.14:1 (AAA) · APCA Lc 94
Contrast pairs
Code-Snippets
CSS
:root {
--sapphire-splendour: #0025af;
--sapphire-splendour-rgb: 0 37 175;
--sapphire-splendour-oklch: oklch(0.372 0.215 264);
}
.element {
color: var(--sapphire-splendour);
background-color: hsl(227 100% 34%);
border-color: oklch(0.372 0.215 264);
}Tailwind CSS v4
@theme {
--color-sapphire-splendour: #0025af;
--color-sapphire-splendour-50: #d8f5ff;
--color-sapphire-splendour-100: #c6e7ff;
--color-sapphire-splendour-200: #a9d1ff;
--color-sapphire-splendour-300: #83b2ff;
--color-sapphire-splendour-400: #5b96ff;
--color-sapphire-splendour-500: #3877ff;
--color-sapphire-splendour-600: #3065e6;
--color-sapphire-splendour-700: #2651b9;
--color-sapphire-splendour-800: #143c8b;
--color-sapphire-splendour-900: #0c2963;
--color-sapphire-splendour-950: #021644;
}SCSS
$sapphire-splendour: #0025af;
$sapphire-splendour-rgb: 0, 37, 175;
$sapphire-splendour-light: mix(#fff, $sapphire-splendour, 20%);
$sapphire-splendour-dark: mix(#000, $sapphire-splendour, 20%);
.element {
color: $sapphire-splendour;
box-shadow: 0 0 0 2px rgba($sapphire-splendour, 0.35);
}