Tropical Teal Color Palette
A vibrant teal palette inspired by tropical waters. Perfect for travel, lifestyle, and summer brands.
Deep Teal
HEX: #004d40
RGB: rgb(0, 77, 64)
HSL: hsl(170, 100%, 15%)
Lagoon
HEX: #00796b
RGB: rgb(0, 121, 107)
HSL: hsl(173, 100%, 24%)
Tropical Teal
HEX: #009688
RGB: rgb(0, 150, 136)
HSL: hsl(174, 100%, 29%)
Aqua Green
HEX: #4db6ac
RGB: rgb(77, 182, 172)
HSL: hsl(174, 42%, 51%)
Seafoam
HEX: #b2dfdb
RGB: rgb(178, 223, 219)
HSL: hsl(175, 41%, 79%)
CSS Variables
:root {
--tropical-teal-1: #004d40;
--tropical-teal-2: #00796b;
--tropical-teal-3: #009688;
--tropical-teal-4: #4db6ac;
--tropical-teal-5: #b2dfdb;
}Tailwind CSS Config
// tailwind.config.js
module.exports = {
theme: {
extend: {
colors: {
'tropical-teal': {
'100': '#004d40',
'200': '#00796b',
'300': '#009688',
'400': '#4db6ac',
'500': '#b2dfdb',
},
},
},
},
}Use Cases
Travel companies
Summer campaigns
Lifestyle brands
Tropical restaurants
Related Palettes
Frequently Asked Questions
What makes teal a versatile color?▾
Teal combines the calming qualities of blue with the renewal energy of green, making it work for healthcare, tech, lifestyle, and environmental brands alike.
Is teal trending in web design?▾
Yes. Teal remains popular in web design because it provides a fresh alternative to standard blue, offering the same professionalism with more personality.