Dichtstbijzijnde benoemde kleur · #FFBABF
#FFBABF
Dichtstbijzijnde benoemde kleur: Piglet
#FFBABF (rgb(255 186 191), hsl(356 100% 86%), oklch(0.854 0.08 14.1)) komt het dichtst bij de benoemde kleur Piglet. Bekijk tinten, schaduwen, harmonieën, WCAG- en APCA-contrast en CSS-, Tailwind v4- en SCSS-code.
#FFBABF
oklch(0.854 0.08 14.1)
Kleurconversies
- HEX
- #ffbabf
- RGB
- rgb(255 186 191)
- HSL
- hsl(356 100% 86%)
- HWB
- hwb(356 73% 0%)
- OKLCH
- oklch(0.854 0.08 14.1)
- OKLab
- oklab(0.854 0.078 0.02)
- CIE Lab
- lab(82.17 26.17 7.86)
- LCH
- lch(82.17 27.32 16.7)
- CMYK
- cmyk(0% 27% 25% 0%)
Tinten · Schaduwen · Tonen
Tinten
- FFC1C5
- FFC8CC
- FFCFD2
- FFD6D8
- FFDDDF
- FFE4E5
- FFEAEC
- FFF1F2
- FFF8F8
Schaduwen
- DEA1A6
- BE898D
- 9E7275
- 805C5E
- 634648
- 483233
- 2E1E1F
- 160D0D
- 030202
Tonen
- F2B4B9
- E5AEB2
- D8A9AC
- CBA3A5
- BF9D9F
- B29799
- A59192
- 998C8C
- 8C8686
Kleurharmonieën
Complementair +180°
- FFBABF
Piglet
- 8EE0DE
≈ Paradisiacal Getaway
Analoog -30° +30°
Triadisch +120° +240°
- FFBABF
Piglet
- BADBA6
≈ Embroidered Silk
- AED2FF
≈ Ice Cold Stare
Gesplitst complementair +150° +210°
- FFBABF
Piglet
- 9DE0C1
≈ Bright Sea Green
- 94DBF6
≈ Shiva Blue
Tetradisch +90° +180° +270°
Contrast en toegankelijkheid
Ag
FailOp wit
WCAG 1.61:1 · APCA Lc 27
Ag
AAAOp zwart
WCAG 13.02:1 · APCA Lc 76
Beste tekstkleur: #000000
WCAG 13.02:1 (AAA) · APCA Lc 76
Contrast pairs
Codefragmenten
CSS
:root {
--piglet: #ffbabf;
--piglet-rgb: 255 186 191;
--piglet-oklch: oklch(0.854 0.08 14.1);
}
.element {
color: var(--piglet);
background-color: hsl(356 100% 86%);
border-color: oklch(0.854 0.08 14.1);
}Tailwind CSS v4
@theme {
--color-piglet: #ffbabf;
--color-piglet-50: #ffeced;
--color-piglet-100: #ffdedf;
--color-piglet-200: #f5c7c9;
--color-piglet-300: #dda7a9;
--color-piglet-400: #c98b90;
--color-piglet-500: #b57076;
--color-piglet-600: #995f64;
--color-piglet-700: #7b4c50;
--color-piglet-800: #5b373b;
--color-piglet-900: #3f2528;
--color-piglet-950: #281416;
}SCSS
$piglet: #ffbabf;
$piglet-rgb: 255, 186, 191;
$piglet-light: mix(#fff, $piglet, 20%);
$piglet-dark: mix(#000, $piglet, 20%);
.element {
color: $piglet;
box-shadow: 0 0 0 2px rgba($piglet, 0.35);
}