CSS Named Color
Copy-ready color values
HEX
#2E8B57RGB
rgb(46, 139, 87)HSL
hsl(146, 50%, 36%)HSV
hsv(146, 67%, 55%)CMYK approx.
cmyk(67, 0, 37, 45)Color value table
| Format | Value | Copy |
|---|---|---|
| HEX | #2E8B57 | |
| RGB | rgb(46, 139, 87) | |
| HSL | hsl(146, 50%, 36%) | |
| HSV | hsv(146, 67%, 55%) | |
| CMYK approx. | cmyk(67, 0, 37, 45) | |
| CSS keyword | seagreen |
Contrast and classification
DarkLightness4.25:1Contrast with white4.95:1Contrast with blackGreen / TealColor family
Shade and tint preview
White 10%#439768
White 30%#6DAE89
White 70%#C0DCCD
White 90%#EAF3EE
Black 10%#297D4E
Black 30%#20613D
Black 70%#0E2A1A
Black 90%#050E09
Harmony palettes
Complementary
#D174A8#DC95BDAnalogous
#398B52#2E855DTriadic
#8B572E#572E8BSplit complementary
#D98DB8#AB5F8AUsing Seagreen
Seagreen works best when it is chosen with contrast, surrounding colors, and interface state in mind. Use the HEX value for static CSS, RGB when you need channel-level control, and HSL when adjusting lightness or saturation for hover states. The CMYK value is an approximate screen-to-print conversion, so print workflows should still rely on calibrated design software or a printer profile.
CSS, SCSS, and Tailwind examples
:root {
--color-seagreen: #2e8b57;
}
.button-primary {
background: var(--color-seagreen);
color: #000000;
}
$seagreen: #2e8b57;
// Tailwind arbitrary value
class="bg-[#2e8b57] text-white"