Dichtstbijzijnde benoemde kleur · #FA6B81
#FA6B81
Dichtstbijzijnde benoemde kleur: Brink Pink
#FA6B81 (rgb(250 107 129), hsl(351 93% 70%), oklch(0.709 0.175 13.3)) komt het dichtst bij de benoemde kleur Brink Pink. Bekijk tinten, schaduwen, harmonieën, WCAG- en APCA-contrast en CSS-, Tailwind v4- en SCSS-code.
#FA6B81
oklch(0.709 0.175 13.3)
Kleurconversies
- HEX
- #fa6b81
- RGB
- rgb(250 107 129)
- HSL
- hsl(351 93% 70%)
- HWB
- hwb(351 42% 2%)
- OKLCH
- oklch(0.709 0.175 13.3)
- OKLab
- oklab(0.709 0.171 0.04)
- CIE Lab
- lab(64.27 56.99 17.05)
- LCH
- lch(64.27 59.48 16.7)
- CMYK
- cmyk(0% 57% 48% 2%)
Tinten · Schaduwen · Tonen
Tinten
- FD7C8D
- FF8B99
- FF9BA6
- FFA9B2
- FFB8BF
- FFC6CB
- FFD5D8
- FFE3E5
- FFF1F2
Schaduwen
- D95C6F
- BA4E5E
- 9B3F4E
- 7D323E
- 61252E
- 46181F
- 2D0D12
- 150406
- 030001
Tonen
- EF6F81
- E37281
- D77581
- CC7881
- C07A81
- B47C81
- A77D81
- 9B7E80
- 8E7F80
Kleurharmonieën
Complementair +180°
- FA6B81
Brink Pink
- 00B8B6
≈ Swagger
Analoog -30° +30°
- FA6B81
Brink Pink
- E96FBD
≈ Explicit Pink
- F87639
≈ Sea Nettle
Triadisch +120° +240°
- FA6B81
Brink Pink
- 73B735
≈ Jubilant Meadow
- 54A4FF
≈ Âbi Blue
Gesplitst complementair +150° +210°
- FA6B81
Brink Pink
- 00BE86
≈ Cōng Lǜ Green
- 00B2DD
≈ Blue Atoll
Tetradisch +90° +180° +270°
- FA6B81
Brink Pink
- B2A400
≈ Snakebite Leather
- 00B8B6
≈ Swagger
- 9591FF
≈ Cobalite
Contrast en toegankelijkheid
Ag
FailOp wit
WCAG 2.80:1 · APCA Lc 53
Ag
AAAOp zwart
WCAG 7.48:1 · APCA Lc 49
Beste tekstkleur: #000000
WCAG 7.48:1 (AAA) · APCA Lc 49
Contrast pairs
Codefragmenten
CSS
:root {
--brink-pink: #fa6b81;
--brink-pink-rgb: 250 107 129;
--brink-pink-oklch: oklch(0.709 0.175 13.3);
}
.element {
color: var(--brink-pink);
background-color: hsl(351 93% 70%);
border-color: oklch(0.709 0.175 13.3);
}Tailwind CSS v4
@theme {
--color-brink-pink: #fa6b81;
--color-brink-pink-50: #ffe1e5;
--color-brink-pink-100: #ffd1d5;
--color-brink-pink-200: #ffb5bc;
--color-brink-pink-300: #ff909a;
--color-brink-pink-400: #f36c80;
--color-brink-pink-500: #e14464;
--color-brink-pink-600: #be3b55;
--color-brink-pink-700: #992f43;
--color-brink-pink-800: #722133;
--color-brink-pink-900: #501622;
--color-brink-pink-950: #350612;
}SCSS
$brink-pink: #fa6b81;
$brink-pink-rgb: 250, 107, 129;
$brink-pink-light: mix(#fff, $brink-pink, 20%);
$brink-pink-dark: mix(#000, $brink-pink, 20%);
.element {
color: $brink-pink;
box-shadow: 0 0 0 2px rgba($brink-pink, 0.35);
}