Dichtstbijzijnde benoemde kleur · #4F6EE2
#4F6EE2
Dichtstbijzijnde benoemde kleur: Royal Blue
#4F6EE2 (rgb(79 110 226), hsl(227 72% 60%), oklch(0.577 0.179 268.9)) komt het dichtst bij de benoemde kleur Royal Blue. Bekijk tinten, schaduwen, harmonieën, WCAG- en APCA-contrast en CSS-, Tailwind v4- en SCSS-code.
#4F6EE2
oklch(0.577 0.179 268.9)
Kleurconversies
- HEX
- #4f6ee2
- RGB
- rgb(79 110 226)
- HSL
- hsl(227 72% 60%)
- HWB
- hwb(227 31% 11%)
- OKLCH
- oklch(0.577 0.179 268.9)
- OKLab
- oklab(0.577 -0.003 -0.179)
- CIE Lab
- lab(48.92 17.6 -63.76)
- LCH
- lch(48.92 66.15 285.4)
- CMYK
- cmyk(65% 51% 0% 11%)
Tinten · Schaduwen · Tonen
Tinten
- 5F7EE6
- 6F8DEA
- 809BEE
- 91AAF1
- A2B8F5
- B4C6F7
- C7D5FA
- D9E3FC
- ECF1FE
Schaduwen
- 445FC4
- 3850A8
- 2E418C
- 233371
- 192657
- 10193E
- 070E27
- 020412
- 000103
Tonen
- 5471D9
- 5874CF
- 5D76C6
- 6278BC
- 677AB3
- 6C7CA9
- 717D9F
- 767E95
- 7B7F8B
Kleurharmonieën
Complementair +180°
- 4F6EE2
Royal Blue
- 967500
≈ Bhūrā Brown
Analoog -30° +30°
- 4F6EE2
Royal Blue
- 0082BD
≈ Phuket Palette
- 8A5AD3
≈ Gloomy Purple
Triadisch +120° +240°
- 4F6EE2
Royal Blue
- CE4135
≈ Rebel Red
- 00923D
≈ Pixelated Grass
Gesplitst complementair +150° +210°
- 4F6EE2
Royal Blue
- B36100
≈ Orange Brown
- 728400
≈ Swamp Green
Tetradisch +90° +180° +270°
- 4F6EE2
Royal Blue
- C73E77
≈ Fuchsia Rose
- 967500
≈ Bhūrā Brown
- 008D7B
≈ Greenlake
Contrast en toegankelijkheid
Ag
AAOp wit
WCAG 4.50:1 · APCA Lc 71
Ag
AAOp zwart
WCAG 4.66:1 · APCA Lc 31
Beste tekstkleur: #000000
WCAG 4.66:1 (AA) · APCA Lc 31
Contrast pairs
Codefragmenten
CSS
:root {
--royal-blue: #4f6ee2;
--royal-blue-rgb: 79 110 226;
--royal-blue-oklch: oklch(0.577 0.179 268.9);
}
.element {
color: var(--royal-blue);
background-color: hsl(227 72% 60%);
border-color: oklch(0.577 0.179 268.9);
}Tailwind CSS v4
@theme {
--color-royal-blue: #4f6ee2;
--color-royal-blue-50: #e2f3ff;
--color-royal-blue-100: #d1e5ff;
--color-royal-blue-200: #b8d0ff;
--color-royal-blue-300: #96b1ff;
--color-royal-blue-400: #7396ff;
--color-royal-blue-500: #5779fb;
--color-royal-blue-600: #4a67d4;
--color-royal-blue-700: #3a52aa;
--color-royal-blue-800: #263d80;
--color-royal-blue-900: #192a5a;
--color-royal-blue-950: #0b173d;
}SCSS
$royal-blue: #4f6ee2;
$royal-blue-rgb: 79, 110, 226;
$royal-blue-light: mix(#fff, $royal-blue, 20%);
$royal-blue-dark: mix(#000, $royal-blue, 20%);
.element {
color: $royal-blue;
box-shadow: 0 0 0 2px rgba($royal-blue, 0.35);
}