Sea green is a soft, balanced hue that blends the calm of ocean water with the freshness of coastal foliage. Understanding the sea green hex code helps designers and developers reproduce this tranquil shade accurately across screens and print.
The hex code #2E8B97 defines sea green in digital color systems and supports consistent branding, user interface design, and accessibility. The sections below explore technical details, practical usage, and common questions about this versatile color.
| Color Name | Hex Code | RGB | Usage Context |
|---|---|---|---|
| Sea Green | #2E8B97 | 46, 139, 151 | Web, UI, Branding |
| HTML Color Name | SeaGreen | 46, 139, 151 | CSS Compatible |
| HSL Values | — | H: 182°, S: 54%, L: 37% | Design Adjustments |
| Contrast Accessibility | #2E8B97 on White | 4.5:1 (Approx.) | Meets AA for Large Text |
Shades and Variations of Sea Green
Exploring lighter and darker versions of the sea green hex code reveals how depth and mood change in a design system.
Tints and Tones
Adding white to #2E8B97 produces fresh tints for backgrounds, while mixing gray generates refined tones suitable for professional interfaces.
Dark Adaptations
Deepening the hue improves readability for text elements and adds sophistication to headers, sidebars, and navigation components.
Practical Design Applications
The sea green hex code works well in digital products, marketing materials, and environmental branding because of its natural associations.
User Interface Elements
Use #2E8B97 for buttons, accents, and progress indicators to communicate calm action and reliable progress in productivity apps.
Brand Identity and Logos
Companies in health, travel, and sustainability sectors adopt this color to suggest growth, trust, and a connection to nature.
Web and Accessibility Guidelines
Implementing the sea green hex code with attention to contrast ensures content remains readable for diverse audiences.
Contrast and Readability
When used for text, verify contrast against backgrounds; pairing #2E8B97 with white or very light tones may require adjustments for compliance.
Color Blind Considerations
Test combinations for common types of color vision deficiency to ensure distinct recognition of status indicators and interactive elements.
Technical Implementation Details
Translating the sea green hex code into consistent formats for CSS, design tools, and development workflows reduces errors and rework.
CSS and HTML Usage
Specify color with #2E8B97, rgb(46, 139, 151), or hsl(182, 54%, 37%) depending on project conventions and browser support requirements.
Design Tool Settings
Enter the hex code directly in color pickers to maintain exact values across Figma, Sketch, Adobe XD, and prototyping platforms.
Optimizing Visual Systems with Sea Green
Treating the sea green hex code as a core part of your design system supports clarity, efficiency, and long-term brand consistency.
- Define primary and secondary usage rules for #2E8B97 in your design tokens
- Document accessible contrast pairings for text and interactive elements
- Create light and dark variants to adapt to different interface modes
- Test the color across devices, lighting conditions, and user preferences
- Use the hex code consistently in CSS, SVG, logos, and marketing assets
FAQ
Reader questions
Is sea green suitable for professional business interfaces?
Yes, sea green conveys stability and growth, and when paired with adequate contrast it works well in dashboards, productivity tools, and corporate digital experiences.
How do I ensure sufficient contrast with the sea green hex code?
Check color combinations using accessibility evaluators, and prefer dark text on light backgrounds or vice versa when #2E8B97 is used for text or thin UI elements.
Can I use sea green in print without color shifts?
Convert the hex code to CMYK values specific to your printer and run proofs to match the screen appearance, since pigments and substrates affect the final result.
What emotions does sea green communicate in branding?
It often evokes calm, health, environmental awareness, and modern simplicity, making it attractive for brands focused on wellbeing and sustainable practices.