Benoemde kleur · #F2BBB1
Ballerina Tears
Ballerina Tears is #F2BBB1: rgb(242 187 177), hsl(9 71% 82%), oklch(0.839 0.066 30.3). Bekijk tinten, schaduwen, harmonieën, WCAG- en APCA-contrast en CSS-, Tailwind v4- en SCSS-code.
What does Pink mean? → · Ballerina Tears color name →
#F2BBB1
oklch(0.839 0.066 30.3)
Kleurconversies
- HEX
- #f2bbb1
- RGB
- rgb(242 187 177)
- HSL
- hsl(9 71% 82%)
- HWB
- hwb(9 69% 5%)
- OKLCH
- oklch(0.839 0.066 30.3)
- OKLab
- oklab(0.839 0.057 0.033)
- CIE Lab
- lab(80.76 19.39 13.12)
- LCH
- lch(80.76 23.42 34.1)
- CMYK
- cmyk(0% 23% 27% 5%)
Tinten · Schaduwen · Tonen
Tinten
- F4C2B9
- F5C9C0
- F7CFC8
- F8D6D0
- FADDD8
- FBE4DF
- FCEBE7
- FDF1EF
- FEF8F7
Schaduwen
- D2A299
- B48A83
- 96736C
- 795C57
- 5E4642
- 43322F
- 2B1F1C
- 140D0C
- 030201
Tonen
- E6B5AC
- DBAFA7
- CFA9A2
- C4A39D
- B89D98
- AD9793
- A2928F
- 968C8A
- 8B8685
Kleurharmonieën
Complementair +180°
- F2BBB1
Ballerina Tears
- 98D6E2
≈ Oceano
Analoog -30° +30°
- F2BBB1
Ballerina Tears
- EFB9C8
≈ Chantilly
- EBC1A0
≈ Toasted Coconut
Triadisch +120° +240°
- F2BBB1
Ballerina Tears
- ACD7B4
≈ Frugal
- BAC9F6
≈ Light Periwinkle
Gesplitst complementair +150° +210°
- F2BBB1
Ballerina Tears
- 9BD9CC
≈ Yucca Cream
- A4D1F1
≈ Marzena Dream
Tetradisch +90° +180° +270°
- F2BBB1
Ballerina Tears
- C4D1A1
≈ Cricket Field
- 98D6E2
≈ Oceano
- D1C1EF
≈ York Plum
Contrast en toegankelijkheid
Ag
FailOp wit
WCAG 1.67:1 · APCA Lc 30
Ag
AAAOp zwart
WCAG 12.51:1 · APCA Lc 73
Beste tekstkleur: #000000
WCAG 12.51:1 (AAA) · APCA Lc 73
Contrast pairs
Codefragmenten
CSS
:root {
--ballerina-tears: #f2bbb1;
--ballerina-tears-rgb: 242 187 177;
--ballerina-tears-oklch: oklch(0.839 0.066 30.3);
}
.element {
color: var(--ballerina-tears);
background-color: hsl(9 71% 82%);
border-color: oklch(0.839 0.066 30.3);
}Tailwind CSS v4
@theme {
--color-ballerina-tears: #f2bbb1;
--color-ballerina-tears-50: #ffefea;
--color-ballerina-tears-100: #fde1da;
--color-ballerina-tears-200: #efcbc3;
--color-ballerina-tears-300: #d7aca3;
--color-ballerina-tears-400: #c29087;
--color-ballerina-tears-500: #ad766c;
--color-ballerina-tears-600: #93645c;
--color-ballerina-tears-700: #765049;
--color-ballerina-tears-800: #573a36;
--color-ballerina-tears-900: #3d2825;
--color-ballerina-tears-950: #261613;
}SCSS
$ballerina-tears: #f2bbb1;
$ballerina-tears-rgb: 242, 187, 177;
$ballerina-tears-light: mix(#fff, $ballerina-tears, 20%);
$ballerina-tears-dark: mix(#000, $ballerina-tears, 20%);
.element {
color: $ballerina-tears;
box-shadow: 0 0 0 2px rgba($ballerina-tears, 0.35);
}