Couleur nommée · #507EA4
Borage
Borage correspond à #507EA4 : rgb(80 126 164), hsl(207 34% 48%), oklch(0.576 0.078 244.6). Teintes, ombres, harmonies, contraste WCAG et APCA, et code CSS, Tailwind v4 et SCSS.
What does Blue mean? → · Borage color name →
#507EA4
oklch(0.576 0.078 244.6)
Conversions de couleur
- HEX
- #507ea4
- RGB
- rgb(80 126 164)
- HSL
- hsl(207 34% 48%)
- HWB
- hwb(207 31% 36%)
- OKLCH
- oklch(0.576 0.078 244.6)
- OKLab
- oklab(0.576 -0.033 -0.07)
- CIE Lab
- lab(50.68 -7.9 -25.61)
- LCH
- lch(50.68 26.8 252.9)
- CMYK
- cmyk(51% 23% 0% 36%)
Teintes · Ombres · Tons
Teintes
- 618AAD
- 7297B6
- 83A4BF
- 94B0C8
- A6BDD2
- B7CADB
- C9D7E4
- DBE4ED
- EDF2F6
Ombres
- 446D8E
- 395C79
- 2E4C64
- 243C50
- 1A2D3D
- 101F2B
- 07111A
- 02050A
- 000101
Tons
- 567EA1
- 5B7F9D
- 607F9A
- 657F96
- 6A8093
- 6E808F
- 73808B
- 778088
- 7C8084
Harmonies de couleurs
Complémentaire +180°
- 507EA4
Borage
- 996F46
≈ Chewy Caramel
Analogue -30° +30°
- 507EA4
Borage
- 3A8595
≈ Precious Stone
- 6B76A7
≈ Blue Batik
Triadique +120° +240°
- 507EA4
Borage
- A06573
≈ Matte Carmine
- 6F814D
≈ Creamed Avocado
Complémentaire divisée +150° +210°
- 507EA4
Borage
- A1685A
≈ Russet Red
- 887941
≈ Capers
Tétradique +90° +180° +270°
Contraste et accessibilité
Ag
FailSur blanc
WCAG 4.31:1 · APCA Lc 70
Ag
AASur noir
WCAG 4.86:1 · APCA Lc 32
Meilleure couleur de texte: #000000
WCAG 4.86:1 (AA) · APCA Lc 32
Contrast pairs
Extraits de code
CSS
:root {
--borage: #507ea4;
--borage-rgb: 80 126 164;
--borage-oklch: oklch(0.576 0.078 244.6);
}
.element {
color: var(--borage);
background-color: hsl(207 34% 48%);
border-color: oklch(0.576 0.078 244.6);
}Tailwind CSS v4
@theme {
--color-borage: #507ea4;
--color-borage-50: #e4f8ff;
--color-borage-100: #d4ebff;
--color-borage-200: #bad8f4;
--color-borage-300: #98bcdd;
--color-borage-400: #77a4ca;
--color-borage-500: #588cb6;
--color-borage-600: #4b769a;
--color-borage-700: #3c5f7b;
--color-borage-800: #29465b;
--color-borage-900: #1c3040;
--color-borage-950: #0c1c29;
}SCSS
$borage: #507ea4;
$borage-rgb: 80, 126, 164;
$borage-light: mix(#fff, $borage, 20%);
$borage-dark: mix(#000, $borage, 20%);
.element {
color: $borage;
box-shadow: 0 0 0 2px rgba($borage, 0.35);
}