Cor nomeada · #674196
Sweet Flag
Sweet Flag é #674196: rgb(103 65 150), hsl(267 40% 42%), oklch(0.46 0.136 302). Veja tons claros, sombras, harmonias, contraste WCAG e APCA e código CSS, Tailwind v4 e SCSS.
What does Purple mean? → · Sweet Flag color name →
#674196
oklch(0.46 0.136 302)
Conversões de cor
- HEX
- #674196
- RGB
- rgb(103 65 150)
- HSL
- hsl(267 40% 42%)
- HWB
- hwb(267 25% 41%)
- OKLCH
- oklch(0.46 0.136 302)
- OKLab
- oklab(0.46 0.072 -0.115)
- CIE Lab
- lab(35.31 30.61 -41.19)
- LCH
- lch(35.31 51.32 306.6)
- CMYK
- cmyk(31% 57% 0% 41%)
Tons claros · Sombras · Tons
Tons claros
- 7554A1
- 8366AC
- 9179B7
- A08BC1
- AF9ECC
- BFB1D6
- CEC4E1
- DED8EB
- EFEBF5
Sombras
- 593782
- 4B2E6E
- 3D255B
- 301C49
- 231337
- 170B26
- 0C0516
- 040108
- 000001
Tons
- 694894
- 6C4F93
- 6E5691
- 715C8F
- 73638D
- 76698B
- 786F88
- 7B7486
- 7D7A83
Harmonias de cor
Complementar +180°
- 674196
Sweet Flag
- 4E6100
≈ Camouflage Green
Análoga -30° +30°
- 674196
Sweet Flag
- 3F4FA3
≈ Dazzling Blue
- 823679
≈ Sparkling Grape
Tríade +120° +240°
- 674196
Sweet Flag
- 814800
≈ Dried Mustard
- 00675C
≈ Dancing Dragonfly
Complementar dividida +150° +210°
- 674196
Sweet Flag
- 6B5600
≈ Ayahuasca Vine
- 006A34
≈ Universal Green
Tétrade +90° +180° +270°
- 674196
Sweet Flag
- 953222
≈ Bengara Red
- 4E6100
≈ Camouflage Green
- 006472
≈ Green Spool
Contraste e acessibilidade
Ag
AAASobre branco
WCAG 7.57:1 · APCA Lc 86
Ag
FailSobre preto
WCAG 2.77:1 · APCA Lc 16
Melhor cor de texto: #FFFFFF
WCAG 7.57:1 (AAA) · APCA Lc 86
Contrast pairs
Trechos de código
CSS
:root {
--sweet-flag: #674196;
--sweet-flag-rgb: 103 65 150;
--sweet-flag-oklch: oklch(0.46 0.136 302);
}
.element {
color: var(--sweet-flag);
background-color: hsl(267 40% 42%);
border-color: oklch(0.46 0.136 302);
}Tailwind CSS v4
@theme {
--color-sweet-flag: #674196;
--color-sweet-flag-50: #fdecff;
--color-sweet-flag-100: #f1ddff;
--color-sweet-flag-200: #e1c6ff;
--color-sweet-flag-300: #c6a6f0;
--color-sweet-flag-400: #ad8ae1;
--color-sweet-flag-500: #976dd0;
--color-sweet-flag-600: #805db0;
--color-sweet-flag-700: #664a8d;
--color-sweet-flag-800: #4a366a;
--color-sweet-flag-900: #33254a;
--color-sweet-flag-950: #1f1331;
}SCSS
$sweet-flag: #674196;
$sweet-flag-rgb: 103, 65, 150;
$sweet-flag-light: mix(#fff, $sweet-flag, 20%);
$sweet-flag-dark: mix(#000, $sweet-flag, 20%);
.element {
color: $sweet-flag;
box-shadow: 0 0 0 2px rgba($sweet-flag, 0.35);
}