Tropical Vibe Color Palette
This palette bursts with a vibrant energy, blending deep teal (#04394e) and lush green (#00875e) with zesty yellows (#a7cc15, #f5cc17) and a bold, fiery orange (#f56217), evoking a lively, tropical atmosphere that feels both refreshing and invigorating.
Practical uses and creative applications
The Tropical Vibe Color Palette radiates a vibrant energy that's perfect for those looking to infuse their projects with a fresh, lively aesthetic. Featuring deep ocean blues (#04394e), lush greens (#00875e), and sunny yellows (#f5cc17) complemented by zesty orange (#f56217) and vibrant lime green (#a7cc15), this palette is ideal for branding efforts in the travel, hospitality, and wellness industries.
Its dynamic colors evoke feelings of warmth and adventure, making it a fantastic choice for logos, packaging designs, and promotional materials that aim to captivate and inspire. Designers and creatives will find the Tropical Vibe Color Palette particularly useful for web design, where the right colors can set the mood and enhance user experience.
Whether you're crafting a beach resort website, an eco-friendly product line, or a vibrant coffee shop brand, this palette offers a harmonious blend that resonates with a youthful, adventurous audience. Furthermore, when applied to interior design, these colors can transform spaces into inviting havens that reflect the essence of tropical locales, making them perfect for cafes, spas, or any space that seeks to create a relaxed yet invigorating atmosphere.
Tailwind color scales
Browse Tailwind CSS color scales. Copy OKLCH, HEX, or HSL with one click. Preview colors in real UI examples and check contrast for accessibility.
dsfds
| 50 | oklch(0.933 0.039 225.31) | #ceeffd | hsl(198, 92%, 90%) |
|
|
| 100 | oklch(0.842 0.092 225.97) | #87d8f9 | hsl(197, 90%, 75%) |
|
|
| 200 | oklch(0.763 0.132 229.40) | #3fc1f5 | hsl(197, 90%, 60%) |
|
|
| 300 | oklch(0.671 0.138 233.88) | #0ba2dd | hsl(197, 91%, 45%) |
|
|
| 400 | oklch(0.504 0.103 233.97) | #086d96 | hsl(197, 90%, 31%) |
|
|
| 500 | oklch(0.324 0.063 231.30) | #04394e | hsl(197, 90%, 16%) |
|
|
| 600 | oklch(0.309 0.059 230.35) | #043548 | hsl(197, 89%, 15%) |
|
|
| 700 | oklch(0.290 0.056 230.85) | #033042 | hsl(197, 91%, 14%) |
|
|
| 800 | oklch(0.275 0.052 229.70) | #032c3c | hsl(197, 90%, 12%) |
|
|
| 900 | oklch(0.259 0.048 228.34) | #032836 | hsl(196, 89%, 11%) |
|
|
| 950 | oklch(0.241 0.046 230.62) | #022331 | hsl(198, 92%, 10%) |
|
dsfds
| 50 | oklch(0.961 0.056 175.23) | #ccfff0 | hsl(162, 100%, 90%) |
|
|
| 100 | oklch(0.922 0.118 171.87) | #8bffdc | hsl(162, 100%, 77%) |
|
|
| 200 | oklch(0.897 0.164 167.94) | #4affc8 | hsl(162, 100%, 65%) |
|
|
| 300 | oklch(0.885 0.191 162.92) | #0affb4 | hsl(162, 100%, 52%) |
|
|
| 400 | oklch(0.736 0.160 162.50) | #00c88b | hsl(162, 100%, 39%) |
|
|
| 500 | oklch(0.552 0.119 163.31) | #00875e | hsl(162, 100%, 26%) |
|
|
| 600 | oklch(0.501 0.107 163.51) | #007652 | hsl(162, 100%, 23%) |
|
|
| 700 | oklch(0.449 0.095 164.51) | #006547 | hsl(162, 100%, 20%) |
|
|
| 800 | oklch(0.398 0.084 164.36) | #00553b | hsl(162, 100%, 17%) |
|
|
| 900 | oklch(0.343 0.072 164.93) | #00442f | hsl(161, 100%, 13%) |
|
|
| 950 | oklch(0.285 0.058 167.21) | #003324 | hsl(162, 100%, 10%) |
|
dsfds
| 50 | oklch(0.969 0.054 116.38) | #f2fad1 | hsl(72, 80%, 90%) |
|
|
| 100 | oklch(0.943 0.103 117.63) | #e6f6a6 | hsl(72, 82%, 81%) |
|
|
| 200 | oklch(0.919 0.146 118.86) | #daf27c | hsl(72, 82%, 72%) |
|
|
| 300 | oklch(0.895 0.180 119.87) | #ceed51 | hsl(72, 81%, 62%) |
|
|
| 400 | oklch(0.875 0.202 121.43) | #c2e927 | hsl(72, 82%, 53%) |
|
|
| 500 | oklch(0.790 0.188 122.03) | #a7cc15 | hsl(72, 81%, 44%) |
|
|
| 600 | oklch(0.696 0.165 121.87) | #8dac12 | hsl(72, 81%, 37%) |
|
|
| 700 | oklch(0.602 0.142 121.98) | #738d0f | hsl(72, 81%, 31%) |
|
|
| 800 | oklch(0.501 0.116 121.17) | #5a6d0b | hsl(72, 82%, 24%) |
|
|
| 900 | oklch(0.398 0.091 121.14) | #404e08 | hsl(72, 81%, 17%) |
|
|
| 950 | oklch(0.284 0.062 120.11) | #262e05 | hsl(72, 80%, 10%) |
|
dsfds
| 50 | oklch(0.965 0.050 96.17) | #fdf4ce | hsl(49, 92%, 90%) |
|
|
| 100 | oklch(0.940 0.086 97.04) | #fbeca9 | hsl(49, 91%, 82%) |
|
|
| 200 | oklch(0.917 0.118 96.67) | #fae485 | hsl(49, 92%, 75%) |
|
|
| 300 | oklch(0.895 0.145 96.60) | #f8dc60 | hsl(49, 92%, 67%) |
|
|
| 400 | oklch(0.875 0.163 95.40) | #f7d43c | hsl(49, 92%, 60%) |
|
|
| 500 | oklch(0.856 0.172 93.84) | #f5cc17 | hsl(49, 92%, 53%) |
|
|
| 600 | oklch(0.772 0.157 93.13) | #d7b109 | hsl(49, 92%, 44%) |
|
|
| 700 | oklch(0.660 0.134 93.21) | #ae8f07 | hsl(49, 92%, 35%) |
|
|
| 800 | oklch(0.541 0.109 93.99) | #846d06 | hsl(49, 91%, 27%) |
|
|
| 900 | oklch(0.416 0.083 95.43) | #5a4b04 | hsl(50, 91%, 18%) |
|
|
| 950 | oklch(0.279 0.055 95.32) | #312802 | hsl(49, 92%, 10%) |
|
dsfds
| 50 | oklch(0.922 0.041 49.05) | #fddece | hsl(20, 92%, 90%) |
|
|
| 100 | oklch(0.864 0.073 48.74) | #fbc5a9 | hsl(20, 91%, 82%) |
|
|
| 200 | oklch(0.811 0.106 47.34) | #faac85 | hsl(20, 92%, 75%) |
|
|
| 300 | oklch(0.761 0.138 47.32) | #f89460 | hsl(21, 92%, 67%) |
|
|
| 400 | oklch(0.716 0.170 45.14) | #f77b3c | hsl(20, 92%, 60%) |
|
|
| 500 | oklch(0.676 0.196 42.00) | #f56217 | hsl(20, 92%, 53%) |
|
|
| 600 | oklch(0.605 0.183 40.79) | #d74f09 | hsl(20, 92%, 44%) |
|
|
| 700 | oklch(0.519 0.155 41.31) | #ae4007 | hsl(20, 92%, 35%) |
|
|
| 800 | oklch(0.426 0.125 41.61) | #843006 | hsl(20, 91%, 27%) |
|
|
| 900 | oklch(0.329 0.092 43.31) | #5a2104 | hsl(20, 91%, 18%) |
|
|
| 950 | oklch(0.227 0.058 47.68) | #311202 | hsl(20, 92%, 10%) |
|
Related palettes
Discover more palettes with a similar mood and vibe or Browse our collection.
