Sea Green
#1B6464
CyanColor Codes
All color formats for development
HEX
#1B6464RGB
rgb(27, 100, 100)HSL
hsl(180, 57%, 25%)OKLCH
oklch(0.46 0.069 195)CMYK
cmyk(73%, 0%, 0%, 61%)Accessibility
WCAG contrast compliance
Tailwind Scale
50-950 scale matching Tailwind CSS naming
Shades
Darker variations
1#195A5A
2#165050
3#134646
4#103C3C
5#0E3232
6#0B2828
7#081E1E
8#051414
9#030A0A
Tints
Lighter variations
1#248282
2#2CA0A0
3#34BEBE
4#4BCECE
5#69D6D6
6#87DEDE
7#A5E6E6
8#C3EFEF
9#E1F7F7
Tones
Muted variations
1#1F6060
2#235D5D
3#265959
4#2A5656
5#2E5252
6#314E4E
7#354B4B
8#384747
9#3C4343
Usage Guidelines
Recommended use cases for each shade level
| Level | Color | Typical Use Cases |
|---|---|---|
| 50 | F3FC #F3FCFC | BackgroundsSubtle highlightsCard backgrounds |
| 100 | E3F7 #E3F7F7 | Light backgroundsTable row hoverSkeleton loading |
| 200 | CBF1 #CBF1F1 | Secondary backgroundsInput backgroundsDividers |
| 300 | A3E6 #A3E6E6 | BordersInactive statesPlaceholder text |
| 400 | 73D9 #73D9D9 | Disabled statesSecondary iconsMuted text |
| 500 | 4BCE #4BCECE | Primary brand colorCTAsActive elementsLinks |
| 600 | 30B0 #30B0B0 | Hover statesFocus ringsPrimary buttons hover |
| 700 | 268C #268C8C | Active/pressed statesDark mode accentsSecondary text |
| 800 | 1B64 #1B6464 | Text on light backgroundsHeadingsStrong borders |
| 900 | 1240 #124040 | Primary textHigh emphasis contentDark headings |
| 950 | 0B28 #0B2828 | Maximum contrast textDark mode backgrounds |
Export Code
Copy ready-to-use code for your project
:root {
--sea-green-50: #F3FCFC;
--sea-green-100: #E3F7F7;
--sea-green-200: #CBF1F1;
--sea-green-300: #A3E6E6;
--sea-green-400: #73D9D9;
--sea-green-500: #4BCECE;
--sea-green-600: #30B0B0;
--sea-green-700: #268C8C;
--sea-green-800: #1B6464;
--sea-green-900: #124040;
--sea-green-950: #0B2828;
}