Cor nomeada mais próxima · #F9B7FD
#F9B7FD
Cor nomeada mais próxima: Strawberry Buttercream
#F9B7FD (rgb(249 183 253), hsl(297 95% 85%), oklch(0.862 0.118 324.6)) é mais próxima da cor nomeada Strawberry Buttercream. Veja tons claros, sombras, harmonias, contraste WCAG e APCA e código CSS, Tailwind v4 e SCSS.
#F9B7FD
oklch(0.862 0.118 324.6)
Conversões de cor
- HEX
- #f9b7fd
- RGB
- rgb(249 183 253)
- HSL
- hsl(297 95% 85%)
- HWB
- hwb(297 72% 1%)
- OKLCH
- oklch(0.862 0.118 324.6)
- OKLab
- oklab(0.862 0.096 -0.068)
- CIE Lab
- lab(82.37 32.95 -25.05)
- LCH
- lch(82.37 41.39 322.8)
- CMYK
- cmyk(2% 28% 0% 1%)
Tons claros · Sombras · Tons
Tons claros
- FABEFD
- FBC6FE
- FCCDFE
- FCD4FE
- FDDBFF
- FEE3FF
- FEEAFF
- FEF1FF
- FFF8FF
Sombras
- D99FDC
- B987BC
- 9A709D
- 7D5A7F
- 614562
- 463147
- 2C1E2D
- 150C16
- 030203
Tons
- ECB2F0
- E0ACE3
- D4A7D6
- C8A1CA
- BB9CBD
- AF96B1
- A391A4
- 988B98
- 8C868C
Harmonias de cor
Complementar +180°
- F9B7FD
Strawberry Buttercream
- A1E6A1
≈ Grape Green
Análoga -30° +30°
- F9B7FD
Strawberry Buttercream
- D4C9FF
≈ Innocent Snowdrop
- FFBBD5
≈ Cotton Candy
Tríade +120° +240°
- F9B7FD
Strawberry Buttercream
- F6CC72
≈ Naked Noodle
- 61E8F6
≈ Shimmering Expanse Cyan
Complementar dividida +150° +210°
- F9B7FD
Strawberry Buttercream
- D0DB7E
≈ Fresh Pear
- 73EBCD
≈ Tiffany Blue
Tétrade +90° +180° +270°
- F9B7FD
Strawberry Buttercream
- FFC39C
≈ Esprit Peach
- A1E6A1
≈ Grape Green
- 9EDBFF
≈ Shiva Blue
Contraste e acessibilidade
Ag
FailSobre branco
WCAG 1.58:1 · APCA Lc 27
Ag
AAASobre preto
WCAG 13.21:1 · APCA Lc 76
Melhor cor de texto: #000000
WCAG 13.21:1 (AAA) · APCA Lc 76
Contrast pairs
Trechos de código
CSS
:root {
--strawberry-buttercream: #f9b7fd;
--strawberry-buttercream-rgb: 249 183 253;
--strawberry-buttercream-oklch: oklch(0.862 0.118 324.6);
}
.element {
color: var(--strawberry-buttercream);
background-color: hsl(297 95% 85%);
border-color: oklch(0.862 0.118 324.6);
}Tailwind CSS v4
@theme {
--color-strawberry-buttercream: #f9b7fd;
--color-strawberry-buttercream-50: #ffeaff;
--color-strawberry-buttercream-100: #fedbfd;
--color-strawberry-buttercream-200: #f0c3ef;
--color-strawberry-buttercream-300: #d8a2d7;
--color-strawberry-buttercream-400: #c186c5;
--color-strawberry-buttercream-500: #ac69b1;
--color-strawberry-buttercream-600: #925996;
--color-strawberry-buttercream-700: #754778;
--color-strawberry-buttercream-800: #55335a;
--color-strawberry-buttercream-900: #3c233f;
--color-strawberry-buttercream-950: #251228;
}SCSS
$strawberry-buttercream: #f9b7fd;
$strawberry-buttercream-rgb: 249, 183, 253;
$strawberry-buttercream-light: mix(#fff, $strawberry-buttercream, 20%);
$strawberry-buttercream-dark: mix(#000, $strawberry-buttercream, 20%);
.element {
color: $strawberry-buttercream;
box-shadow: 0 0 0 2px rgba($strawberry-buttercream, 0.35);
}