Nearest named color · #145BD6
#145BD6
Nearest named color: Frosted Blueberries
#145BD6 (rgb(20 91 214), hsl(218 83% 46%), oklch(0.509 0.201 261)) is closest to the named color Frosted Blueberries. See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
#145BD6
oklch(0.509 0.201 261)
Color conversions
- HEX
- #145bd6
- RGB
- rgb(20 91 214)
- HSL
- hsl(218 83% 46%)
- HWB
- hwb(218 8% 16%)
- OKLCH
- oklch(0.509 0.201 261)
- OKLab
- oklab(0.509 -0.031 -0.198)
- CIE Lab
- lab(40.79 17.74 -70.25)
- LCH
- lch(40.79 72.46 284.2)
- CMYK
- cmyk(91% 57% 0% 16%)
Tints · Shades · Tones
Tints
- 306DDC
- 487FE1
- 5E90E6
- 75A0EB
- 8BB0EF
- A2C0F3
- B9D0F7
- D0E0FA
- E7EFFD
Shades
- 104EBA
- 0C419E
- 083584
- 05296A
- 031E52
- 01133B
- 010925
- 000310
- 000002
Tones
- 2461CE
- 3166C6
- 3C6BBE
- 466FB6
- 5172AE
- 5A76A5
- 64799C
- 6E7B93
- 777E8A
Color harmonies
Complementary +180°
- 145BD6
Frosted Blueberries
- 845E00
≈ Soil of Avagddu
Analogous -30° +30°
- 145BD6
Frosted Blueberries
- 006F96
≈ Tropic Sea
- 6C43CD
≈ Purple Rain
Triadic +120° +240°
- 145BD6
Frosted Blueberries
- BE0A2E
≈ Old Glory Red
- 197B00
≈ Botanical Beauty
Split-complementary +150° +210°
- 145BD6
Frosted Blueberries
- 9F4A00
≈ Oregon
- 696B00
≈ Brownish Green
Tetradic +90° +180° +270°
- 145BD6
Frosted Blueberries
- B21574
≈ King’s Plum Pie
- 845E00
≈ Soil of Avagddu
- 00785E
≈ Emerald Dream
Contrast & accessibility
Ag
AAOn white
WCAG 6.00:1 · APCA Lc 79
Ag
FailOn black
WCAG 3.49:1 · APCA Lc 23
Best text color: #FFFFFF
WCAG 6.00:1 (AA) · APCA Lc 79
Contrast pairs
Code snippets
CSS
:root {
--frosted-blueberries: #145bd6;
--frosted-blueberries-rgb: 20 91 214;
--frosted-blueberries-oklch: oklch(0.509 0.201 261);
}
.element {
color: var(--frosted-blueberries);
background-color: hsl(218 83% 46%);
border-color: oklch(0.509 0.201 261);
}Tailwind CSS v4
@theme {
--color-frosted-blueberries: #145bd6;
--color-frosted-blueberries-50: #d7f6ff;
--color-frosted-blueberries-100: #c5e8ff;
--color-frosted-blueberries-200: #a7d4ff;
--color-frosted-blueberries-300: #80b4ff;
--color-frosted-blueberries-400: #569aff;
--color-frosted-blueberries-500: #2e7cff;
--color-frosted-blueberries-600: #286adf;
--color-frosted-blueberries-700: #2054b3;
--color-frosted-blueberries-800: #0e3e86;
--color-frosted-blueberries-900: #082b5f;
--color-frosted-blueberries-950: #001741;
}SCSS
$frosted-blueberries: #145bd6;
$frosted-blueberries-rgb: 20, 91, 214;
$frosted-blueberries-light: mix(#fff, $frosted-blueberries, 20%);
$frosted-blueberries-dark: mix(#000, $frosted-blueberries, 20%);
.element {
color: $frosted-blueberries;
box-shadow: 0 0 0 2px rgba($frosted-blueberries, 0.35);
}