Cor nomeada · #F8C0BA
Mystic Rose
Mystic Rose é #F8C0BA: rgb(248 192 186), hsl(6 82% 85%), oklch(0.856 0.065 25.5). Veja tons claros, sombras, harmonias, contraste WCAG e APCA e código CSS, Tailwind v4 e SCSS.
What does Pink mean? → · Mystic Rose color name →
#F8C0BA
oklch(0.856 0.065 25.5)
Conversões de cor
- HEX
- #f8c0ba
- RGB
- rgb(248 192 186)
- HSL
- hsl(6 82% 85%)
- HWB
- hwb(6 73% 3%)
- OKLCH
- oklch(0.856 0.065 25.5)
- OKLab
- oklab(0.856 0.059 0.028)
- CIE Lab
- lab(82.73 20.06 11.18)
- LCH
- lch(82.73 22.97 29.1)
- CMYK
- cmyk(0% 23% 25% 3%)
Tons claros · Sombras · Tons
Tons claros
- F9C6C1
- FACDC8
- FBD3CE
- FCD9D5
- FDDFDC
- FDE6E3
- FEECEA
- FEF2F1
- FFF9F8
Sombras
- D8A7A1
- B88E89
- 9A7672
- 7C5F5C
- 604946
- 453432
- 2C201E
- 150E0D
- 030202
Tons
- ECB9B4
- DFB3AE
- D3ADA8
- C7A6A2
- BBA09D
- AF9997
- A39391
- 978D8B
- 8C8686
Harmonias de cor
Complementar +180°
- F8C0BA
Mystic Rose
- 9DDDE5
≈ Charlotte
Análoga -30° +30°
- F8C0BA
Mystic Rose
- F4BFD1
≈ Pink Destiny
- F2C5A7
≈ Flip-Flop
Tríade +120° +240°
- F8C0BA
Mystic Rose
- B5DCB6
≈ A Mann’s Mint
- BBD0FC
≈ Ice Cold Stare
Complementar dividida +150° +210°
- F8C0BA
Mystic Rose
- A3DECE
≈ Sparkling Mint
- A7D7F5
≈ Juzcar Blue
Tétrade +90° +180° +270°
- F8C0BA
Mystic Rose
- CDD6A5
≈ Trailing Vine
- 9DDDE5
≈ Charlotte
- D3C8F7
≈ Innocent Snowdrop
Contraste e acessibilidade
Ag
FailSobre branco
WCAG 1.58:1 · APCA Lc 27
Ag
AAASobre preto
WCAG 13.24:1 · APCA Lc 76
Melhor cor de texto: #000000
WCAG 13.24:1 (AAA) · APCA Lc 76
Contrast pairs
Trechos de código
CSS
:root {
--mystic-rose: #f8c0ba;
--mystic-rose-rgb: 248 192 186;
--mystic-rose-oklch: oklch(0.856 0.065 25.5);
}
.element {
color: var(--mystic-rose);
background-color: hsl(6 82% 85%);
border-color: oklch(0.856 0.065 25.5);
}Tailwind CSS v4
@theme {
--color-mystic-rose: #f8c0ba;
--color-mystic-rose-50: #ffefeb;
--color-mystic-rose-100: #fde0dc;
--color-mystic-rose-200: #efcac5;
--color-mystic-rose-300: #d7aba5;
--color-mystic-rose-400: #c2908b;
--color-mystic-rose-500: #ad7570;
--color-mystic-rose-600: #93645f;
--color-mystic-rose-700: #764f4c;
--color-mystic-rose-800: #573937;
--color-mystic-rose-900: #3d2726;
--color-mystic-rose-950: #261514;
}SCSS
$mystic-rose: #f8c0ba;
$mystic-rose-rgb: 248, 192, 186;
$mystic-rose-light: mix(#fff, $mystic-rose, 20%);
$mystic-rose-dark: mix(#000, $mystic-rose, 20%);
.element {
color: $mystic-rose;
box-shadow: 0 0 0 2px rgba($mystic-rose, 0.35);
}