Cor nomeada · #0504AA
Traditional Royal Blue
Traditional Royal Blue é #0504AA: rgb(5 4 170), hsl(240 95% 34%), oklch(0.337 0.229 264.9). Veja tons claros, sombras, harmonias, contraste WCAG e APCA e código CSS, Tailwind v4 e SCSS.
What does Blue mean? → · Traditional Royal Blue color name →
#0504AA
oklch(0.337 0.229 264.9)
Conversões de cor
- HEX
- #0504aa
- RGB
- rgb(5 4 170)
- HSL
- hsl(240 95% 34%)
- HWB
- hwb(240 2% 33%)
- OKLCH
- oklch(0.337 0.229 264.9)
- OKLab
- oklab(0.337 -0.02 -0.228)
- CIE Lab
- lab(18.18 49.31 -81.76)
- LCH
- lch(18.18 95.48 301.1)
- CMYK
- cmyk(97% 98% 0% 33%)
Tons claros · Sombras · Tons
Tons claros
- 0F33B5
- 264FBF
- 3E66C9
- 587DD2
- 7293DB
- 8DA9E4
- A9BEEB
- C5D4F2
- E2E9F9
Sombras
- 040393
- 03027D
- 020168
- 010153
- 01013F
- 00002D
- 00001B
- 00000B
- 000001
Tons
- 0724A7
- 1235A4
- 1F42A1
- 2D4D9E
- 3A579A
- 486096
- 566991
- 64718C
- 727986
Harmonias de cor
Complementar +180°
- 0504AA
Traditional Royal Blue
- 483400
≈ Night in the Woods
Análoga -30° +30°
- 0504AA
Traditional Royal Blue
- 003C56
≈ Duskwood
- 440089
≈ Grim Purple
Tríade +120° +240°
- 0504AA
Traditional Royal Blue
- 6D000C
≈ Barolo
- 00440C
≈ Wailing Woods
Complementar dividida +150° +210°
- 0504AA
Traditional Royal Blue
- 572900
≈ Fudge Brownie
- 363B00
≈ Dark Olive
Tétrade +90° +180° +270°
- 0504AA
Traditional Royal Blue
- 68003B
≈ Tyrian Purple
- 483400
≈ Night in the Woods
- 004235
≈ UP Forest Green
Contraste e acessibilidade
Ag
AAASobre branco
WCAG 13.09:1 · APCA Lc 97
Ag
FailSobre preto
WCAG 1.60:1 · APCA Lc 0
Melhor cor de texto: #FFFFFF
WCAG 13.09:1 (AAA) · APCA Lc 97
Contrast pairs
Trechos de código
CSS
:root {
--traditional-royal-blue: #0504aa;
--traditional-royal-blue-rgb: 5 4 170;
--traditional-royal-blue-oklch: oklch(0.337 0.229 264.9);
}
.element {
color: var(--traditional-royal-blue);
background-color: hsl(240 95% 34%);
border-color: oklch(0.337 0.229 264.9);
}Tailwind CSS v4
@theme {
--color-traditional-royal-blue: #0504aa;
--color-traditional-royal-blue-50: #d8f4ff;
--color-traditional-royal-blue-100: #c5e6ff;
--color-traditional-royal-blue-200: #a8d0ff;
--color-traditional-royal-blue-300: #82b0ff;
--color-traditional-royal-blue-400: #5a93ff;
--color-traditional-royal-blue-500: #3873ff;
--color-traditional-royal-blue-600: #3062ee;
--color-traditional-royal-blue-700: #264fbf;
--color-traditional-royal-blue-800: #133a90;
--color-traditional-royal-blue-900: #0c2866;
--color-traditional-royal-blue-950: #021547;
}SCSS
$traditional-royal-blue: #0504aa;
$traditional-royal-blue-rgb: 5, 4, 170;
$traditional-royal-blue-light: mix(#fff, $traditional-royal-blue, 20%);
$traditional-royal-blue-dark: mix(#000, $traditional-royal-blue, 20%);
.element {
color: $traditional-royal-blue;
box-shadow: 0 0 0 2px rgba($traditional-royal-blue, 0.35);
}