Color con nombre · #304471
Bona Fide
Bona Fide es #304471: rgb(48 68 113), hsl(222 40% 32%), oklch(0.393 0.081 264.8). Mira tintes, sombras, armonías, contraste WCAG y APCA, y código CSS, Tailwind v4 y SCSS.
What does Blue mean? → · Bona Fide color name →
#304471
oklch(0.393 0.081 264.8)
Conversiones de color
- HEX
- #304471
- RGB
- rgb(48 68 113)
- HSL
- hsl(222 40% 32%)
- HWB
- hwb(222 19% 56%)
- OKLCH
- oklch(0.393 0.081 264.8)
- OKLab
- oklab(0.393 -0.007 -0.08)
- CIE Lab
- lab(28.91 3.2 -28.89)
- LCH
- lch(28.91 29.06 276.3)
- CMYK
- cmyk(58% 40% 0% 56%)
Tintes · Sombras · Tonos
Tintes
- 42557F
- 55678D
- 68799B
- 7C8BA9
- 919DB7
- A6B0C5
- BCC4D4
- D2D7E2
- E8EBF0
Sombras
- 283A61
- 213052
- 1A2643
- 131D35
- 0C1427
- 060C1A
- 03050E
- 010204
- 000001
Tonos
- 384A73
- 3F5075
- 475677
- 4F5C78
- 57627A
- 5F687B
- 676E7D
- 6F747E
- 787A7F
Armonías de color
Complementario +180°
- 304471
Bona Fide
- 594100
≈ Sugarloaf Brown
Análogo -30° +30°
- 304471
Bona Fide
- 054C6A
≈ Navy Dark Blue
- 493C6C
≈ Meteorite
Triádico +120° +240°
- 304471
Bona Fide
- 6B332F
≈ Kenyan Copper
- 275129
≈ Chestnut Green
Complementario dividido +150° +210°
- 304471
Bona Fide
- 663815
≈ Meatloaf
- 454A0D
≈ No Emissions Green
Tetrádico +90° +180° +270°
- 304471
Bona Fide
- 673248
≈ Old Mauve
- 594100
≈ Sugarloaf Brown
- 005243
≈ Tetsu Green
Contraste y accesibilidad
Ag
AAASobre blanco
WCAG 9.58:1 · APCA Lc 92
Ag
FailSobre negro
WCAG 2.19:1 · APCA Lc 10
Mejor color de texto: #FFFFFF
WCAG 9.58:1 (AAA) · APCA Lc 92
Contrast pairs
Fragmentos de código
CSS
:root {
--bona-fide: #304471;
--bona-fide-rgb: 48 68 113;
--bona-fide-oklch: oklch(0.393 0.081 264.8);
}
.element {
color: var(--bona-fide);
background-color: hsl(222 40% 32%);
border-color: oklch(0.393 0.081 264.8);
}Tailwind CSS v4
@theme {
--color-bona-fide: #304471;
--color-bona-fide-50: #ebf5ff;
--color-bona-fide-100: #dce8ff;
--color-bona-fide-200: #c5d4f8;
--color-bona-fide-300: #a5b7e2;
--color-bona-fide-400: #879ecf;
--color-bona-fide-500: #6c85bc;
--color-bona-fide-600: #5b719f;
--color-bona-fide-700: #495a80;
--color-bona-fide-800: #33425f;
--color-bona-fide-900: #232e42;
--color-bona-fide-950: #121a2b;
}SCSS
$bona-fide: #304471;
$bona-fide-rgb: 48, 68, 113;
$bona-fide-light: mix(#fff, $bona-fide, 20%);
$bona-fide-dark: mix(#000, $bona-fide, 20%);
.element {
color: $bona-fide;
box-shadow: 0 0 0 2px rgba($bona-fide, 0.35);
}