Cor nomeada · #006CA9
Indigo Bunting
Indigo Bunting é #006CA9: rgb(0 108 169), hsl(202 100% 33%), oklch(0.512 0.126 244). Veja tons claros, sombras, harmonias, contraste WCAG e APCA e código CSS, Tailwind v4 e SCSS.
What does Blue mean? → · Indigo Bunting color name →
#006CA9
oklch(0.512 0.126 244)
Conversões de cor
- HEX
- #006ca9
- RGB
- rgb(0 108 169)
- HSL
- hsl(202 100% 33%)
- HWB
- hwb(202 0% 34%)
- OKLCH
- oklch(0.512 0.126 244)
- OKLab
- oklab(0.512 -0.055 -0.114)
- CIE Lab
- lab(43 -8.52 -40.69)
- LCH
- lch(43 41.58 258.2)
- CMYK
- cmyk(100% 36% 0% 34%)
Tons claros · Sombras · Tons
Tons claros
- 2E7BB2
- 4989BB
- 6198C4
- 78A6CD
- 8EB5D6
- A4C4DE
- BBD2E6
- D1E1EF
- E8F0F7
Sombras
- 005D92
- 004E7C
- 004067
- 003253
- 00253F
- 00192C
- 000D1B
- 00040A
- 000001
Tons
- 1F6FA5
- 3071A2
- 3D739E
- 48769A
- 537896
- 5C7A92
- 667B8E
- 6F7D89
- 777F85
Harmonias de cor
Complementar +180°
- 006CA9
Indigo Bunting
- 935600
≈ Mochaccino
Análoga -30° +30°
- 006CA9
Indigo Bunting
- 007386
≈ Glamour Green
- 515EAE
≈ Chinese Bellflower
Tríade +120° +240°
- 006CA9
Indigo Bunting
- 9F425E
≈ Gooseberry
- 587202
≈ Over the Hills
Complementar dividida +150° +210°
- 006CA9
Indigo Bunting
- A24632
≈ Toasted Paprika
- 7A6500
≈ Arousing Alligator
Tétrade +90° +180° +270°
- 006CA9
Indigo Bunting
- 914784
≈ Willowherb
- 935600
≈ Mochaccino
- 087B43
≈ Tokiwa Green
Contraste e acessibilidade
Ag
AASobre branco
WCAG 5.64:1 · APCA Lc 78
Ag
FailSobre preto
WCAG 3.71:1 · APCA Lc 24
Melhor cor de texto: #FFFFFF
WCAG 5.64:1 (AA) · APCA Lc 78
Contrast pairs
Trechos de código
CSS
:root {
--indigo-bunting: #006ca9;
--indigo-bunting-rgb: 0 108 169;
--indigo-bunting-oklch: oklch(0.512 0.126 244);
}
.element {
color: var(--indigo-bunting);
background-color: hsl(202 100% 33%);
border-color: oklch(0.512 0.126 244);
}Tailwind CSS v4
@theme {
--color-indigo-bunting: #006ca9;
--color-indigo-bunting-50: #d8faff;
--color-indigo-bunting-100: #c6edff;
--color-indigo-bunting-200: #a8daff;
--color-indigo-bunting-300: #80bef4;
--color-indigo-bunting-400: #56a6e3;
--color-indigo-bunting-500: #258dd3;
--color-indigo-bunting-600: #2377b2;
--color-indigo-bunting-700: #1c608f;
--color-indigo-bunting-800: #0e476a;
--color-indigo-bunting-900: #09314b;
--color-indigo-bunting-950: #001d31;
}SCSS
$indigo-bunting: #006ca9;
$indigo-bunting-rgb: 0, 108, 169;
$indigo-bunting-light: mix(#fff, $indigo-bunting, 20%);
$indigo-bunting-dark: mix(#000, $indigo-bunting, 20%);
.element {
color: $indigo-bunting;
box-shadow: 0 0 0 2px rgba($indigo-bunting, 0.35);
}