Color con nombre · #FBBBAE
Ruffles
Ruffles es #FBBBAE: rgb(251 187 174), hsl(10 91% 83%), oklch(0.847 0.077 31.7). Mira tintes, sombras, armonías, contraste WCAG y APCA, y código CSS, Tailwind v4 y SCSS.
What does Pink mean? → · Ruffles color name →
#FBBBAE
oklch(0.847 0.077 31.7)
Conversiones de color
- HEX
- #fbbbae
- RGB
- rgb(251 187 174)
- HSL
- hsl(10 91% 83%)
- HWB
- hwb(10 68% 2%)
- OKLCH
- oklch(0.847 0.077 31.7)
- OKLab
- oklab(0.847 0.065 0.04)
- CIE Lab
- lab(81.65 22.52 16.12)
- LCH
- lch(81.65 27.7 35.6)
- CMYK
- cmyk(0% 25% 31% 2%)
Tintes · Sombras · Tonos
Tintes
- FCC2B6
- FDC9BE
- FDD0C6
- FED6CE
- FEDDD6
- FFE4DE
- FFEBE6
- FFF1EF
- FFF8F7
Sombras
- DAA297
- BA8A80
- 9C736A
- 7E5C55
- 614641
- 46322E
- 2D1F1C
- 150D0B
- 030201
Tonos
- EEB5A9
- E2AFA5
- D5A9A0
- C9A39C
- BD9D97
- B09892
- A4928E
- 988C89
- 8C8685
Armonías de color
Complementario +180°
- FBBBAE
Ruffles
- 90DBEA
≈ Photon Barrier
Análogo -30° +30°
- FBBBAE
Ruffles
- F9B8C9
≈ Christy’s Smile
- F2C29A
≈ Carving Party
Triádico +120° +240°
- FBBBAE
Ruffles
- A8DCB4
≈ Celtic Spring
- BBCBFF
≈ Light Periwinkle
Complementario dividido +150° +210°
- FBBBAE
Ruffles
- 93DED0
≈ Pale Robin Egg Blue
- A0D4FB
≈ Malmö FF
Tetrádico +90° +180° +270°
Contraste y accesibilidad
Ag
FailSobre blanco
WCAG 1.63:1 · APCA Lc 28
Ag
AAASobre negro
WCAG 12.82:1 · APCA Lc 75
Mejor color de texto: #000000
WCAG 12.82:1 (AAA) · APCA Lc 75
Contrast pairs
Fragmentos de código
CSS
:root {
--ruffles: #fbbbae;
--ruffles-rgb: 251 187 174;
--ruffles-oklch: oklch(0.847 0.077 31.7);
}
.element {
color: var(--ruffles);
background-color: hsl(10 91% 83%);
border-color: oklch(0.847 0.077 31.7);
}Tailwind CSS v4
@theme {
--color-ruffles: #fbbbae;
--color-ruffles-50: #ffeee7;
--color-ruffles-100: #ffdfd7;
--color-ruffles-200: #f3c9bf;
--color-ruffles-300: #dcaa9e;
--color-ruffles-400: #c88e82;
--color-ruffles-500: #b37366;
--color-ruffles-600: #976157;
--color-ruffles-700: #7a4e45;
--color-ruffles-800: #5a3833;
--color-ruffles-900: #3f2622;
--color-ruffles-950: #281512;
}SCSS
$ruffles: #fbbbae;
$ruffles-rgb: 251, 187, 174;
$ruffles-light: mix(#fff, $ruffles, 20%);
$ruffles-dark: mix(#000, $ruffles, 20%);
.element {
color: $ruffles;
box-shadow: 0 0 0 2px rgba($ruffles, 0.35);
}