Named color · #4B8EB0
Atlantic Gull
Atlantic Gull is #4B8EB0: rgb(75 142 176), hsl(200 40% 49%), oklch(0.616 0.085 232.6). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Blue mean? → · Atlantic Gull color name →
#4B8EB0
oklch(0.616 0.085 232.6)
Color conversions
- HEX
- #4b8eb0
- RGB
- rgb(75 142 176)
- HSL
- hsl(200 40% 49%)
- HWB
- hwb(200 29% 31%)
- OKLCH
- oklch(0.616 0.085 232.6)
- OKLab
- oklab(0.616 -0.052 -0.068)
- CIE Lab
- lab(55.67 -14.47 -24.85)
- LCH
- lch(55.67 28.76 239.8)
- CMYK
- cmyk(57% 19% 0% 31%)
Tints · Shades · Tones
Tints
- 5E99B8
- 71A4C0
- 82AFC8
- 94BBD0
- A6C6D8
- B8D1E0
- C9DCE7
- DBE8EF
- EDF3F7
Shades
- 407B99
- 356882
- 2B566C
- 214456
- 173442
- 0E242E
- 06151C
- 02070B
- 000101
Tones
- 528DAB
- 598CA7
- 5F8AA2
- 64899D
- 698898
- 6E8693
- 73858F
- 78838A
- 7C8285
Color harmonies
Complementary +180°
- 4B8EB0
Atlantic Gull
- AE7654
≈ New England Roast
Analogous -30° +30°
- 4B8EB0
Atlantic Gull
- 39949B
≈ Aqua Lake
- 6985B9
≈ Kimono
Triadic +120° +240°
- 4B8EB0
Atlantic Gull
- AD6F8A
≈ Mauve Orchid
- 868B4C
≈ Enough Is Enough
Split-complementary +150° +210°
- 4B8EB0
Atlantic Gull
- B3706D
≈ Terra Tone
- 9E8046
≈ Golden Harmony
Tetradic +90° +180° +270°
- 4B8EB0
Atlantic Gull
- 9E74A3
≈ Karma Chameleon
- AE7654
≈ New England Roast
- 669263
≈ Arizona Tree Frog
Contrast & accessibility
Ag
FailOn white
WCAG 3.62:1 · APCA Lc 64
Ag
AAOn black
WCAG 5.79:1 · APCA Lc 38
Best text color: #000000
WCAG 5.79:1 (AA) · APCA Lc 38
Contrast pairs
Code snippets
CSS
:root {
--atlantic-gull: #4b8eb0;
--atlantic-gull-rgb: 75 142 176;
--atlantic-gull-oklch: oklch(0.616 0.085 232.6);
}
.element {
color: var(--atlantic-gull);
background-color: hsl(200 40% 49%);
border-color: oklch(0.616 0.085 232.6);
}Tailwind CSS v4
@theme {
--color-atlantic-gull: #4b8eb0;
--color-atlantic-gull-50: #dffaff;
--color-atlantic-gull-100: #cdedff;
--color-atlantic-gull-200: #b1dbf4;
--color-atlantic-gull-300: #8cbfdd;
--color-atlantic-gull-400: #68a7c9;
--color-atlantic-gull-500: #4490b5;
--color-atlantic-gull-600: #3b7a99;
--color-atlantic-gull-700: #2f617b;
--color-atlantic-gull-800: #1f485a;
--color-atlantic-gull-900: #14323f;
--color-atlantic-gull-950: #061e28;
}SCSS
$atlantic-gull: #4b8eb0;
$atlantic-gull-rgb: 75, 142, 176;
$atlantic-gull-light: mix(#fff, $atlantic-gull, 20%);
$atlantic-gull-dark: mix(#000, $atlantic-gull, 20%);
.element {
color: $atlantic-gull;
box-shadow: 0 0 0 2px rgba($atlantic-gull, 0.35);
}