Cor nomeada · #FDBAC4
Pink Bubble Tea
Pink Bubble Tea é #FDBAC4: rgb(253 186 196), hsl(351 94% 86%), oklch(0.853 0.078 8.9). Veja tons claros, sombras, harmonias, contraste WCAG e APCA e código CSS, Tailwind v4 e SCSS.
What does Pink mean? → · Pink Bubble Tea color name →
#FDBAC4
oklch(0.853 0.078 8.9)
Conversões de cor
- HEX
- #fdbac4
- RGB
- rgb(253 186 196)
- HSL
- hsl(351 94% 86%)
- HWB
- hwb(351 73% 1%)
- OKLCH
- oklch(0.853 0.078 8.9)
- OKLab
- oklab(0.853 0.077 0.012)
- CIE Lab
- lab(82.06 25.94 4.99)
- LCH
- lch(82.06 26.42 10.9)
- CMYK
- cmyk(0% 26% 23% 1%)
Tons claros · Sombras · Tons
Tons claros
- FEC1CA
- FEC8D0
- FFCFD5
- FFD6DB
- FFDDE1
- FFE3E7
- FFEAED
- FFF1F3
- FFF8F9
Sombras
- DCA1AA
- BC8991
- 9D7278
- 7F5C61
- 62464A
- 473235
- 2D1E21
- 160D0E
- 030202
Tons
- F0B4BD
- E3AEB6
- D7A9AF
- CAA3A8
- BE9DA1
- B1979B
- A59194
- 998C8D
- 8C8687
Harmonias de cor
Complementar +180°
- FDBAC4
Pink Bubble Tea
- 91E0D9
≈ Pale Beryl
Análoga -30° +30°
- FDBAC4
Pink Bubble Tea
- F2BBE0
≈ Pink Heath
- FDBEA9
≈ Porcellana
Tríade +120° +240°
- FDBAC4
Pink Bubble Tea
- BFD9A3
≈ Embroidered Silk
- A9D4FF
≈ Malmö FF
Complementar dividida +150° +210°
- FDBAC4
Pink Bubble Tea
- A3DFBC
≈ Bright Sea Green
- 93DCF2
≈ Photon Barrier
Tétrade +90° +180° +270°
- FDBAC4
Pink Bubble Tea
- DBD095
≈ Bongo Skin
- 91E0D9
≈ Pale Beryl
- C4CBFF
≈ Lavender Blue
Contraste e acessibilidade
Ag
FailSobre branco
WCAG 1.61:1 · APCA Lc 28
Ag
AAASobre preto
WCAG 12.99:1 · APCA Lc 75
Melhor cor de texto: #000000
WCAG 12.99:1 (AAA) · APCA Lc 75
Contrast pairs
Trechos de código
CSS
:root {
--pink-bubble-tea: #fdbac4;
--pink-bubble-tea-rgb: 253 186 196;
--pink-bubble-tea-oklch: oklch(0.853 0.078 8.9);
}
.element {
color: var(--pink-bubble-tea);
background-color: hsl(351 94% 86%);
border-color: oklch(0.853 0.078 8.9);
}Tailwind CSS v4
@theme {
--color-pink-bubble-tea: #fdbac4;
--color-pink-bubble-tea-50: #ffedf0;
--color-pink-bubble-tea-100: #ffdee1;
--color-pink-bubble-tea-200: #f4c7cc;
--color-pink-bubble-tea-300: #dca7ad;
--color-pink-bubble-tea-400: #c88b95;
--color-pink-bubble-tea-500: #b3707b;
--color-pink-bubble-tea-600: #975f68;
--color-pink-bubble-tea-700: #794c53;
--color-pink-bubble-tea-800: #5a373e;
--color-pink-bubble-tea-900: #3f252a;
--color-pink-bubble-tea-950: #281418;
}SCSS
$pink-bubble-tea: #fdbac4;
$pink-bubble-tea-rgb: 253, 186, 196;
$pink-bubble-tea-light: mix(#fff, $pink-bubble-tea, 20%);
$pink-bubble-tea-dark: mix(#000, $pink-bubble-tea, 20%);
.element {
color: $pink-bubble-tea;
box-shadow: 0 0 0 2px rgba($pink-bubble-tea, 0.35);
}