Nearest named color · #6174B1
#6174B1
Nearest named color: Flood
#6174B1 (rgb(97 116 177), hsl(226 34% 54%), oklch(0.57 0.097 270)) is closest to the named color Flood. See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
#6174B1
oklch(0.57 0.097 270)
Color conversions
- HEX
- #6174b1
- RGB
- rgb(97 116 177)
- HSL
- hsl(226 34% 54%)
- HWB
- hwb(226 38% 31%)
- OKLCH
- oklch(0.57 0.097 270)
- OKLab
- oklab(0.57 0 -0.097)
- CIE Lab
- lab(49.31 5.47 -35.14)
- LCH
- lch(49.31 35.56 278.8)
- CMYK
- cmyk(45% 34% 0% 31%)
Tints · Shades · Tones
Tints
- 6F81B9
- 7E8FC1
- 8D9DC9
- 9DAAD1
- ADB8D9
- BDC6E1
- CDD4E8
- DDE2F0
- EEF1F8
Shades
- 536499
- 465483
- 39456C
- 2D3757
- 212942
- 151B2F
- 0B0F1C
- 03050C
- 000101
Tones
- 6476AC
- 6777A8
- 6A78A3
- 6D7A9E
- 707B99
- 737C94
- 777D90
- 7A7E8A
- 7D7F85
Color harmonies
Complementary +180°
- 6174B1
Flood
- 8E742A
≈ Aubergine Green
Analogous -30° +30°
- 6174B1
Flood
- 3A7EAB
≈ Beijing Blue
- 806AA8
≈ Wintertime Mauve
Triadic +120° +240°
- 6174B1
Flood
- A96055
≈ Dried Tomatoes
- 4A8758
≈ Kilkenny
Split-complementary +150° +210°
- 6174B1
Flood
- A16937
≈ Hot Ginger
- 708039
≈ Leaps and Bounds
Tetradic +90° +180° +270°
Contrast & accessibility
Ag
AAOn white
WCAG 4.52:1 · APCA Lc 71
Ag
AAOn black
WCAG 4.64:1 · APCA Lc 30
Best text color: #000000
WCAG 4.64:1 (AA) · APCA Lc 30
Contrast pairs
Code snippets
CSS
:root {
--flood: #6174b1;
--flood-rgb: 97 116 177;
--flood-oklch: oklch(0.57 0.097 270);
}
.element {
color: var(--flood);
background-color: hsl(226 34% 54%);
border-color: oklch(0.57 0.097 270);
}Tailwind CSS v4
@theme {
--color-flood: #6174b1;
--color-flood-50: #ebf4ff;
--color-flood-100: #dce7ff;
--color-flood-200: #c5d3ff;
--color-flood-300: #a6b5ea;
--color-flood-400: #889cd9;
--color-flood-500: #6d82c7;
--color-flood-600: #5c6ea8;
--color-flood-700: #4a5887;
--color-flood-800: #344164;
--color-flood-900: #232d46;
--color-flood-950: #121a2e;
}SCSS
$flood: #6174b1;
$flood-rgb: 97, 116, 177;
$flood-light: mix(#fff, $flood, 20%);
$flood-dark: mix(#000, $flood, 20%);
.element {
color: $flood;
box-shadow: 0 0 0 2px rgba($flood, 0.35);
}