Dichtstbijzijnde benoemde kleur · #3FBCA8
#3FBCA8
Dichtstbijzijnde benoemde kleur: Emerald Bliss
#3FBCA8 (rgb(63 188 168), hsl(170 50% 49%), oklch(0.722 0.113 180.2)) komt het dichtst bij de benoemde kleur Emerald Bliss. Bekijk tinten, schaduwen, harmonieën, WCAG- en APCA-contrast en CSS-, Tailwind v4- en SCSS-code.
#3FBCA8
oklch(0.722 0.113 180.2)
Kleurconversies
- HEX
- #3fbca8
- RGB
- rgb(63 188 168)
- HSL
- hsl(170 50% 49%)
- HWB
- hwb(170 25% 26%)
- OKLCH
- oklch(0.722 0.113 180.2)
- OKLab
- oklab(0.722 -0.113 0)
- CIE Lab
- lab(69.13 -39.29 -0.44)
- LCH
- lch(69.13 39.29 180.6)
- CMYK
- cmyk(66% 0% 11% 26%)
Tinten · Schaduwen · Tonen
Tinten
- 5AC3B0
- 70CAB9
- 84D0C1
- 97D7CA
- A9DED3
- BBE5DB
- CCEBE4
- DDF2ED
- EEF8F6
Schaduwen
- 35A392
- 2C8B7C
- 237367
- 1B5D52
- 12473F
- 0A322C
- 041F1A
- 010D0A
- 000201
Tonen
- 4CB6A4
- 56B0A0
- 5FAA9C
- 66A498
- 6C9E94
- 719890
- 75928C
- 798C88
- 7D8684
Kleurharmonieën
Complementair +180°
- 3FBCA8
Emerald Bliss
- DF86A2
≈ Sweet Chrysanthemum
Analoog -30° +30°
- 3FBCA8
Emerald Bliss
- 6EB97F
≈ Lucerne
- 34B8CC
≈ Utopia Beckons
Triadisch +120° +240°
- 3FBCA8
Emerald Bliss
- B095E1
≈ Dreamy Candy Forest
- D99458
≈ Brushed Clay
Gesplitst complementair +150° +210°
- 3FBCA8
Emerald Bliss
- CD8BC7
≈ Rose Souvenir
- E3897A
≈ Mellow Coral
Tetradisch +90° +180° +270°
- 3FBCA8
Emerald Bliss
- 8AA1EC
≈ Cold Lips
- DF86A2
≈ Sweet Chrysanthemum
- C0A24A
≈ Spontaneous Sprig
Contrast en toegankelijkheid
Ag
FailOp wit
WCAG 2.34:1 · APCA Lc 46
Ag
AAAOp zwart
WCAG 8.97:1 · APCA Lc 56
Beste tekstkleur: #000000
WCAG 8.97:1 (AAA) · APCA Lc 56
Contrast pairs
Codefragmenten
CSS
:root {
--emerald-bliss: #3fbca8;
--emerald-bliss-rgb: 63 188 168;
--emerald-bliss-oklch: oklch(0.722 0.113 180.2);
}
.element {
color: var(--emerald-bliss);
background-color: hsl(170 50% 49%);
border-color: oklch(0.722 0.113 180.2);
}Tailwind CSS v4
@theme {
--color-emerald-bliss: #3fbca8;
--color-emerald-bliss-50: #d3fff8;
--color-emerald-bliss-100: #bff5eb;
--color-emerald-bliss-200: #9de5d8;
--color-emerald-bliss-300: #70cbbc;
--color-emerald-bliss-400: #40b4a1;
--color-emerald-bliss-500: #009e89;
--color-emerald-bliss-600: #008574;
--color-emerald-bliss-700: #006b5d;
--color-emerald-bliss-800: #004f42;
--color-emerald-bliss-900: #00372e;
--color-emerald-bliss-950: #00211b;
}SCSS
$emerald-bliss: #3fbca8;
$emerald-bliss-rgb: 63, 188, 168;
$emerald-bliss-light: mix(#fff, $emerald-bliss, 20%);
$emerald-bliss-dark: mix(#000, $emerald-bliss, 20%);
.element {
color: $emerald-bliss;
box-shadow: 0 0 0 2px rgba($emerald-bliss, 0.35);
}