Benoemde kleur · #BCDDB3
A Mann’s Mint
A Mann’s Mint is #BCDDB3: rgb(188 221 179), hsl(107 38% 78%), oklch(0.862 0.067 139). Bekijk tinten, schaduwen, harmonieën, WCAG- en APCA-contrast en CSS-, Tailwind v4- en SCSS-code.
What does Green mean? → · A Mann’s Mint color name →
#BCDDB3
oklch(0.862 0.067 139)
Kleurconversies
- HEX
- #bcddb3
- RGB
- rgb(188 221 179)
- HSL
- hsl(107 38% 78%)
- HWB
- hwb(107 70% 13%)
- OKLCH
- oklch(0.862 0.067 139)
- OKLab
- oklab(0.862 -0.05 0.044)
- CIE Lab
- lab(84.87 -17.08 16.92)
- LCH
- lch(84.87 24.04 135.3)
- CMYK
- cmyk(15% 0% 19% 13%)
Tinten · Schaduwen · Tonen
Tinten
- C3E0BB
- C9E4C2
- D0E7CA
- D7EBD1
- DDEED9
- E4F2E0
- EBF5E8
- F2F8F0
- F8FCF7
Schaduwen
- A3C09B
- 8BA484
- 73886E
- 5D6E58
- 475543
- 323D2F
- 1F261D
- 0D110C
- 020201
Tonen
- B6D3AE
- B0CAA9
- AAC0A4
- A4B79F
- 9EAD99
- 98A494
- 929B8F
- 8C928A
- 868985
Kleurharmonieën
Complementair +180°
- BCDDB3
A Mann’s Mint
- E5C4EE
≈ Prom Corsage
Analoog -30° +30°
- BCDDB3
A Mann’s Mint
- D5D6A3
≈ Garden Glade
- A7E1CA
≈ Turquoise Tower
Triadisch +120° +240°
- BCDDB3
A Mann’s Mint
- B8D4FE
≈ Ice Cold Stare
- FBC1C0
≈ Carnation Bloom
Gesplitst complementair +150° +210°
- BCDDB3
A Mann’s Mint
- D0CBFC
≈ Lavender Blue
- F5C1D9
≈ Cherry Blossom
Tetradisch +90° +180° +270°
- BCDDB3
A Mann’s Mint
- A4DBF5
≈ Mizu Cyan
- E5C4EE
≈ Prom Corsage
- F7C6AC
≈ Coral Bisque
Contrast en toegankelijkheid
Ag
FailOp wit
WCAG 1.48:1 · APCA Lc 23
Ag
AAAOp zwart
WCAG 14.13:1 · APCA Lc 80
Beste tekstkleur: #000000
WCAG 14.13:1 (AAA) · APCA Lc 80
Contrast pairs
Codefragmenten
CSS
:root {
--a-mann-s-mint: #bcddb3;
--a-mann-s-mint-rgb: 188 221 179;
--a-mann-s-mint-oklch: oklch(0.862 0.067 139);
}
.element {
color: var(--a-mann-s-mint);
background-color: hsl(107 38% 78%);
border-color: oklch(0.862 0.067 139);
}Tailwind CSS v4
@theme {
--color-a-mann-s-mint: #bcddb3;
--color-a-mann-s-mint-50: #ebfae8;
--color-a-mann-s-mint-100: #dceed9;
--color-a-mann-s-mint-200: #c5dcc1;
--color-a-mann-s-mint-300: #a5c0a1;
--color-a-mann-s-mint-400: #8ba882;
--color-a-mann-s-mint-500: #6f9166;
--color-a-mann-s-mint-600: #5f7b57;
--color-a-mann-s-mint-700: #4b6245;
--color-a-mann-s-mint-800: #374831;
--color-a-mann-s-mint-900: #263221;
--color-a-mann-s-mint-950: #141e11;
}SCSS
$a-mann-s-mint: #bcddb3;
$a-mann-s-mint-rgb: 188, 221, 179;
$a-mann-s-mint-light: mix(#fff, $a-mann-s-mint, 20%);
$a-mann-s-mint-dark: mix(#000, $a-mann-s-mint, 20%);
.element {
color: $a-mann-s-mint;
box-shadow: 0 0 0 2px rgba($a-mann-s-mint, 0.35);
}