Codes & values
- Color Name
Emerald - Color ID
KDF-C-01096065 - HEX
#10B981 - RGB
rgb(16, 185, 129) - RGBA
rgba(16, 185, 129, 1) - HSL
hsl(160, 84%, 39%) - HSLA
hsla(160, 84%, 39%, 1) - HSV / HSB
hsv(160, 91%, 73%) - CMYK
cmyk(91%, 0%, 30%, 27%) - Light / Dark
mid
Quick answers
- What is the HEX code for Emerald?
- #10B981
- What is Emerald RGB?
- rgb(16, 185, 129)
- What is Emerald HSL?
- hsl(160, 84%, 39%)
- What is Emerald CMYK?
- cmyk(91%, 0%, 30%, 27%)
What is Emerald?
Emerald is a curated cyan family color at #10B981. It appears in our library with tags for ui, branding, design, web. This mid-range shade works as a primary brand or UI accent when contrast with text is verified. Temperature lean: cool — calmer, often used for tech, healthcare, and finance trust..
Emerald HEX code
The HEX code for Emerald is #10B981. Paste it into CSS as color: #10B981; or background-color: #10B981;. Design tools accept the same six-digit value without the # prefix (10b981).
Emerald RGB
Emerald in RGB is rgb(16, 185, 129) (channels R 16, G 185, B 129). Use RGB when you need opacity via rgba(16, 185, 129, 1).
Emerald HSL & HSV
HSL is hsl(160, 84%, 39%) — useful for generating lighter/darker variants by adjusting lightness. HSV/HSB is hsv(160, 91%, 73%), closer to how many digital pickers expose hue, saturation, and brightness.
Emerald CMYK
Approximate CMYK for Emerald is cmyk(91%, 0%, 30%, 27%). Screen HEX/RGB values are device-dependent; for print, always soft-proof in your print profile rather than relying on a web conversion alone.
Shades of Emerald
Darker shades (mixed toward black): #0D9A6C, #0B7B56, #085D41, #053E2B, #031F15. Use deeper shades for hover states, borders, and dark-mode accents.
Tints of Emerald
Lighter tints (mixed toward white): #38C596, #60D0AB, #88DCC0, #AFE8D5, #D7F3EA. Tints work well for soft backgrounds, chips, and secondary buttons.
Colors that go with Emerald
Complementary pairing: #10B981, #B91048. Analogous neighbors: #10B92D, #10B981, #109CB9. Triadic accents: #10B981, #8110B9, #B98110. Always check text contrast when pairing.
Emerald color combinations
A practical combo: primary #10B981, complementary accent #B91048, and a neutral charcoal or off-white for text and surfaces. Split-complementary options: #10B981, #B9109C, #B92D10.
Emerald in web design
Cyan and teal feel modern and technical. They suit dashboards, SaaS accents, and ocean-inspired branding when balanced with neutrals.
Emerald in branding
Teal brands feel fresh and digital-native — popular with fintech and travel startups. Contrast vs white is 2.54:1 (better as a large accent or background than small body text); vs black 8.28:1.
Frequently asked questions
- What is the HEX code for Emerald?
- Emerald: #10B981.
- What is Emerald RGB?
- Emerald: rgb(16, 185, 129).
- What is Emerald HSL?
- Emerald: hsl(160, 84%, 39%).
- What is Emerald CMYK?
- Emerald: cmyk(91%, 0%, 30%, 27%).
- What colors go with Emerald?
- Try complementary #10B981, #B91048 or analogous #10B92D, #10B981, #109CB9.
- Is Emerald good for text on white?
- Not ideal for small body text (2.54:1). Use as a large heading, button, or background instead.
Accessibility snapshot
Contrast vs white: 2.54:1 (prefer large accent or background). Contrast vs black: 8.28:1. Complementary swatch: #10B981, #B91048.
Explore related
Cyan colorsColor pickerPalette generatorContrast checkerColor guidesComplete Color Code GuideHow HEX Colors WorkHEX vs RGB vs CMYK