Sea Green
#008048
GreenColor Codes
All color formats for development
HEX
#008048RGB
rgb(0, 128, 72)HSL
hsl(154, 100%, 25%)OKLCH
oklch(0.527 0.13 155.1)CMYK
cmyk(100%, 0%, 44%, 50%)Accessibility
WCAG contrast compliance
Tailwind Scale
50-950 scale matching Tailwind CSS naming
Shades
Darker variations
1#007341
2#00663A
3#005933
4#004D2B
5#004024
6#00331D
7#002616
8#001A0E
9#000D07
Tints
Lighter variations
1#00A65E
2#00CC74
3#00F289
4#1AFF9C
5#40FFAC
6#66FFBD
7#8CFFCD
8#B3FFDE
9#D9FFEE
Tones
Muted variations
1#067947
2#0D7347
3#136C46
4#196645
5#206044
6#265943
7#2D5342
8#334D41
9#394641
Usage Guidelines
Recommended use cases for each shade level
| Level | Color | Typical Use Cases |
|---|---|---|
| 50 | F0FF #F0FFF8 | BackgroundsSubtle highlightsCard backgrounds |
| 100 | DBFF #DBFFF0 | Light backgroundsTable row hoverSkeleton loading |
| 200 | BDFF #BDFFE2 | Secondary backgroundsInput backgroundsDividers |
| 300 | 8AFF #8AFFCC | BordersInactive statesPlaceholder text |
| 400 | 4DFF #4DFFB2 | Disabled statesSecondary iconsMuted text |
| 500 | 1AFF #1AFF9C | Primary brand colorCTAsActive elementsLinks |
| 600 | 00E0 #00E07F | Hover statesFocus ringsPrimary buttons hover |
| 700 | 00B3 #00B365 | Active/pressed statesDark mode accentsSecondary text |
| 800 | 0080 #008048 | Text on light backgroundsHeadingsStrong borders |
| 900 | 0052 #00522E | Primary textHigh emphasis contentDark headings |
| 950 | 0033 #00331D | Maximum contrast textDark mode backgrounds |
Export Code
Copy ready-to-use code for your project
:root {
--sea-green-50: #F0FFF8;
--sea-green-100: #DBFFF0;
--sea-green-200: #BDFFE2;
--sea-green-300: #8AFFCC;
--sea-green-400: #4DFFB2;
--sea-green-500: #1AFF9C;
--sea-green-600: #00E07F;
--sea-green-700: #00B365;
--sea-green-800: #008048;
--sea-green-900: #00522E;
--sea-green-950: #00331D;
}