Coastal Vibe Color Palette
This vibrant palette blends deep teal and turquoise with sunlit golds, evoking a lively coastal vibe that feels both refreshing and energizing, perfect for a modern beachside retreat.
Practical uses and creative applications
The Coastal Vibe Color Palette is a refreshing blend of oceanic hues and sun-kissed shades, perfect for evoking a sense of tranquility and adventure. Featuring deep teal (#036061), vibrant aqua (#008083), soothing sea blue (#259EA1), warm golden yellow (#FBAC37), and bright sunshine yellow (#FFBF15), this palette is ideal for branding and web design focused on wellness, travel, or coastal living.
Designers seeking to create a relaxed yet invigorating atmosphere will find this palette particularly appealing for projects that aim to transport their audience to sunlit shores. Ideal for creatives in the fields of packaging, interior design, and digital media, the Coastal Vibe Color Palette can elevate products like beachwear, organic skincare, or eco-friendly home goods.
Its harmonious blend of colors not only captures the essence of seaside escapes but also appeals to environmentally conscious consumers. Whether designing a coastal-themed website or refreshing an interior space, this palette sets an inviting mood that resonates with those yearning for a slice of paradise in their daily lives.
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.
50 | oklch(0.962 0.048 196.38) | #cefdfd | hsl(180, 92%, 90%) |
|
|
100 | oklch(0.918 0.104 196.24) | #88fafb | hsl(181, 93%, 76%) |
|
|
200 | oklch(0.891 0.139 196.08) | #42f7f9 | hsl(181, 94%, 62%) |
|
|
300 | oklch(0.849 0.144 195.89) | #07eaec | hsl(181, 94%, 48%) |
|
|
400 | oklch(0.655 0.111 196.32) | #05a5a7 | hsl(181, 94%, 34%) |
|
|
500 | oklch(0.444 0.075 196.05) | #036061 | hsl(181, 94%, 20%) |
|
|
600 | oklch(0.414 0.070 194.80) | #035757 | hsl(180, 93%, 18%) |
|
|
700 | oklch(0.381 0.064 196.32) | #024d4e | hsl(181, 95%, 16%) |
|
|
800 | oklch(0.351 0.059 194.80) | #024444 | hsl(180, 94%, 14%) |
|
|
900 | oklch(0.316 0.053 196.76) | #023a3b | hsl(181, 93%, 12%) |
|
|
950 | oklch(0.284 0.047 194.83) | #023131 | hsl(180, 92%, 10%) |
|
50 | oklch(0.963 0.051 197.85) | #ccfeff | hsl(181, 100%, 90%) |
|
|
100 | oklch(0.925 0.104 197.74) | #8afcff | hsl(182, 100%, 77%) |
|
|
200 | oklch(0.903 0.139 197.24) | #49fbff | hsl(181, 100%, 64%) |
|
|
300 | oklch(0.891 0.151 197.92) | #07f9ff | hsl(181, 100%, 51%) |
|
|
400 | oklch(0.733 0.125 198.11) | #00c0c5 | hsl(182, 100%, 39%) |
|
|
500 | oklch(0.544 0.093 197.67) | #008083 | hsl(181, 100%, 26%) |
|
|
600 | oklch(0.495 0.084 198.04) | #007073 | hsl(182, 100%, 23%) |
|
|
700 | oklch(0.447 0.076 197.25) | #006163 | hsl(181, 100%, 19%) |
|
|
800 | oklch(0.395 0.067 197.66) | #005153 | hsl(181, 100%, 16%) |
|
|
900 | oklch(0.341 0.058 198.25) | #004143 | hsl(182, 100%, 13%) |
|
|
950 | oklch(0.288 0.049 196.92) | #003233 | hsl(181, 100%, 10%) |
|
50 | oklch(0.948 0.032 196.62) | #d6f5f5 | hsl(180, 61%, 90%) |
|
|
100 | oklch(0.895 0.063 198.55) | #abeaec | hsl(182, 63%, 80%) |
|
|
200 | oklch(0.849 0.090 197.35) | #81e0e2 | hsl(181, 63%, 70%) |
|
|
300 | oklch(0.804 0.111 197.36) | #56d5d8 | hsl(181, 63%, 59%) |
|
|
400 | oklch(0.759 0.120 196.97) | #2fc8cb | hsl(181, 62%, 49%) |
|
|
500 | oklch(0.638 0.100 197.50) | #259ea1 | hsl(181, 63%, 39%) |
|
|
600 | oklch(0.569 0.089 196.94) | #208789 | hsl(181, 62%, 33%) |
|
|
700 | oklch(0.495 0.077 197.35) | #1a6f71 | hsl(181, 63%, 27%) |
|
|
800 | oklch(0.421 0.064 196.48) | #155859 | hsl(181, 62%, 22%) |
|
|
900 | oklch(0.340 0.050 197.03) | #0f4041 | hsl(181, 63%, 16%) |
|
|
950 | oklch(0.258 0.036 195.16) | #0a2929 | hsl(180, 61%, 10%) |
|
50 | oklch(0.946 0.044 77.23) | #feeacd | hsl(36, 96%, 90%) |
|
|
100 | oklch(0.915 0.070 78.01) | #fddeaf | hsl(36, 95%, 84%) |
|
|
200 | oklch(0.884 0.095 76.37) | #fdd191 | hsl(36, 96%, 78%) |
|
|
300 | oklch(0.856 0.118 76.06) | #fcc573 | hsl(36, 96%, 72%) |
|
|
400 | oklch(0.828 0.138 73.87) | #fcb855 | hsl(36, 97%, 66%) |
|
|
500 | oklch(0.802 0.154 71.91) | #fbac37 | hsl(36, 96%, 60%) |
|
|
600 | oklch(0.762 0.170 64.92) | #fa9705 | hsl(36, 96%, 50%) |
|
|
700 | oklch(0.647 0.143 65.65) | #c87904 | hsl(36, 96%, 40%) |
|
|
800 | oklch(0.526 0.115 66.83) | #965b03 | hsl(36, 96%, 30%) |
|
|
900 | oklch(0.397 0.085 69.09) | #643d02 | hsl(36, 96%, 20%) |
|
|
950 | oklch(0.255 0.053 72.81) | #321e01 | hsl(36, 96%, 10%) |
|
50 | oklch(0.960 0.050 89.76) | #fff1cc | hsl(44, 100%, 90%) |
|
|
100 | oklch(0.933 0.085 89.86) | #ffe7a7 | hsl(44, 100%, 83%) |
|
|
200 | oklch(0.907 0.116 89.34) | #ffdd83 | hsl(44, 100%, 76%) |
|
|
300 | oklch(0.883 0.142 88.46) | #ffd35e | hsl(44, 100%, 68%) |
|
|
400 | oklch(0.861 0.160 86.59) | #ffc93a | hsl(44, 100%, 61%) |
|
|
500 | oklch(0.841 0.170 83.56) | #ffbf15 | hsl(44, 100%, 54%) |
|
|
600 | oklch(0.771 0.159 81.46) | #e7a800 | hsl(44, 100%, 45%) |
|
|
700 | oklch(0.656 0.135 81.76) | #ba8700 | hsl(44, 100%, 36%) |
|
|
800 | oklch(0.536 0.110 82.22) | #8d6600 | hsl(43, 100%, 28%) |
|
|
900 | oklch(0.411 0.084 84.29) | #604600 | hsl(44, 100%, 19%) |
|
|
950 | oklch(0.274 0.056 87.08) | #332500 | hsl(44, 100%, 10%) |
|
Related palettes
Discover more palettes with a similar mood and vibe or Browse our collection