Cor nomeada · #BA8F7F
Rosetta
Rosetta é #BA8F7F: rgb(186 143 127), hsl(16 30% 61%), oklch(0.687 0.057 41.3). Veja tons claros, sombras, harmonias, contraste WCAG e APCA e código CSS, Tailwind v4 e SCSS.
What does Red mean? → · Rosetta color name →
#BA8F7F
oklch(0.687 0.057 41.3)
Conversões de cor
- HEX
- #ba8f7f
- RGB
- rgb(186 143 127)
- HSL
- hsl(16 30% 61%)
- HWB
- hwb(16 50% 27%)
- OKLCH
- oklch(0.687 0.057 41.3)
- OKLab
- oklab(0.687 0.043 0.038)
- CIE Lab
- lab(63.26 15.11 15.14)
- LCH
- lch(63.26 21.39 45.1)
- CMYK
- cmyk(0% 23% 32% 27%)
Tons claros · Sombras · Tons
Tons claros
- C19A8B
- C8A598
- CFB0A4
- D6BBB1
- DDC6BD
- E4D1CA
- EBDDD7
- F2E8E4
- F8F3F2
Sombras
- A17C6E
- 89695D
- 72574C
- 5C453C
- 46342D
- 32241F
- 1E1511
- 0D0706
- 020101
Tons
- B48E7F
- AF8C7F
- A98B80
- A38980
- 9D8880
- 978680
- 928580
- 8C8380
- 868280
Harmonias de cor
Complementar +180°
- BA8F7F
Rosetta
- 72A3B4
≈ Estuary Blue
Análoga -30° +30°
- BA8F7F
Rosetta
- BB8C91
≈ Rosenkavalier
- B19573
≈ Coffee Kiss
Tríade +120° +240°
- BA8F7F
Rosetta
- 7BA68F
≈ Free Green
- 9497BE
≈ Thistle Down
Complementar dividida +150° +210°
- BA8F7F
Rosetta
- 70A6A3
≈ Steel Pan Mallet
- 809DBD
≈ Washed Denim
Tétrade +90° +180° +270°
Contraste e acessibilidade
Ag
FailSobre branco
WCAG 2.86:1 · APCA Lc 55
Ag
AAASobre preto
WCAG 7.32:1 · APCA Lc 47
Melhor cor de texto: #000000
WCAG 7.32:1 (AAA) · APCA Lc 47
Contrast pairs
Trechos de código
CSS
:root {
--rosetta: #ba8f7f;
--rosetta-rgb: 186 143 127;
--rosetta-oklch: oklch(0.687 0.057 41.3);
}
.element {
color: var(--rosetta);
background-color: hsl(16 30% 61%);
border-color: oklch(0.687 0.057 41.3);
}Tailwind CSS v4
@theme {
--color-rosetta: #ba8f7f;
--color-rosetta-50: #fff0e8;
--color-rosetta-100: #fae2d9;
--color-rosetta-200: #ebcdc1;
--color-rosetta-300: #d2afa0;
--color-rosetta-400: #bd9484;
--color-rosetta-500: #a87a69;
--color-rosetta-600: #8e6759;
--color-rosetta-700: #725247;
--color-rosetta-800: #543c34;
--color-rosetta-900: #3b2923;
--color-rosetta-950: #251712;
}SCSS
$rosetta: #ba8f7f;
$rosetta-rgb: 186, 143, 127;
$rosetta-light: mix(#fff, $rosetta, 20%);
$rosetta-dark: mix(#000, $rosetta, 20%);
.element {
color: $rosetta;
box-shadow: 0 0 0 2px rgba($rosetta, 0.35);
}