Coastal Breeze Color Palette
This palette radiates a refreshing coastal vibe with deep teal and vibrant aqua hues, evoking a tranquil yet invigorating atmosphere reminiscent of serene ocean breezes and sunlit waters.
Practical uses and creative applications
The Coastal Breeze Color Palette is an inviting blend of cool tones that evoke the refreshing essence of ocean waves and serene shorelines. Featuring deep shades like #343838, complemented by vibrant hues such as #005f6b, #008c9e, #00b4cc, and #00dffc, this palette is ideal for designers and creatives looking to infuse a sense of tranquility and modernity into their projects.
Whether you’re crafting a branding identity or developing a website, these colors can help convey a fresh, calming aesthetic that resonates with audiences seeking relaxation and rejuvenation. Perfect for web design, packaging, and interiors, the Coastal Breeze palette works exceptionally well for businesses in wellness, hospitality, and travel.
Imagine a spa website adorned with these soothing colors, or packaging for a health drink that captures the essence of the ocean. The combination of cool blues and greens creates a harmonious atmosphere, making it an excellent choice for brands aiming to promote a lifestyle focused on wellness and nature.
By utilizing the Coastal Breeze palette, designers can create spaces and visuals that not only attract attention but also evoke feelings of peace and inspiration.
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.924 0.001 197.14) | #e5e6e6 | hsl(180, 2%, 90%) |
|
|
100 | oklch(0.820 0.006 197.05) | #c0c5c5 | hsl(180, 4%, 76%) |
|
|
200 | oklch(0.710 0.008 196.98) | #9ca3a3 | hsl(180, 4%, 63%) |
|
|
300 | oklch(0.596 0.011 196.87) | #788181 | hsl(180, 4%, 49%) |
|
|
400 | oklch(0.469 0.008 196.90) | #565c5c | hsl(180, 3%, 35%) |
|
|
500 | oklch(0.337 0.005 196.90) | #343838 | hsl(180, 4%, 21%) |
|
|
600 | oklch(0.314 0.004 196.94) | #2f3232 | hsl(180, 3%, 19%) |
|
|
700 | oklch(0.290 0.004 196.92) | #292c2c | hsl(180, 4%, 17%) |
|
|
800 | oklch(0.267 0.003 196.98) | #242626 | hsl(180, 3%, 15%) |
|
|
900 | oklch(0.241 0.003 196.96) | #1e2020 | hsl(180, 3%, 12%) |
|
|
950 | oklch(0.217 0.002 197.04) | #191a1a | hsl(180, 2%, 10%) |
|
dsfds
50 | oklch(0.953 0.047 206.35) | #ccf9ff | hsl(187, 100%, 90%) |
|
|
100 | oklch(0.899 0.101 206.53) | #86f1ff | hsl(187, 100%, 76%) |
|
|
200 | oklch(0.859 0.135 208.07) | #3fe9ff | hsl(187, 100%, 62%) |
|
|
300 | oklch(0.820 0.142 210.93) | #00dcf8 | hsl(187, 100%, 49%) |
|
|
400 | oklch(0.641 0.111 209.74) | #009eb1 | hsl(186, 100%, 35%) |
|
|
500 | oklch(0.445 0.077 209.69) | #005f6b | hsl(187, 100%, 21%) |
|
|
600 | oklch(0.412 0.071 209.82) | #005560 | hsl(187, 100%, 19%) |
|
|
700 | oklch(0.378 0.065 209.98) | #004b55 | hsl(187, 100%, 17%) |
|
|
800 | oklch(0.343 0.059 208.53) | #004149 | hsl(187, 100%, 14%) |
|
|
900 | oklch(0.308 0.053 208.55) | #00373e | hsl(187, 100%, 12%) |
|
|
950 | oklch(0.272 0.047 208.59) | #002d33 | hsl(187, 100%, 10%) |
|
dsfds
50 | oklch(0.953 0.047 206.35) | #ccf9ff | hsl(187, 100%, 90%) |
|
|
100 | oklch(0.905 0.094 206.56) | #90f2ff | hsl(187, 100%, 78%) |
|
|
200 | oklch(0.869 0.128 207.67) | #54ebff | hsl(187, 100%, 66%) |
|
|
300 | oklch(0.845 0.144 209.51) | #17e5ff | hsl(187, 100%, 55%) |
|
|
400 | oklch(0.744 0.129 211.07) | #00c1da | hsl(187, 100%, 43%) |
|
|
500 | oklch(0.587 0.102 210.57) | #008c9e | hsl(187, 100%, 31%) |
|
|
600 | oklch(0.528 0.092 210.78) | #007989 | hsl(187, 100%, 27%) |
|
|
700 | oklch(0.468 0.081 209.94) | #006673 | hsl(187, 100%, 23%) |
|
|
800 | oklch(0.405 0.070 210.12) | #00535e | hsl(187, 100%, 18%) |
|
|
900 | oklch(0.340 0.059 208.70) | #004048 | hsl(187, 100%, 14%) |
|
|
950 | oklch(0.272 0.047 208.59) | #002d33 | hsl(187, 100%, 10%) |
|
dsfds
50 | oklch(0.953 0.047 206.35) | #ccf9ff | hsl(187, 100%, 90%) |
|
|
100 | oklch(0.912 0.088 206.53) | #99f3ff | hsl(187, 100%, 80%) |
|
|
200 | oklch(0.878 0.119 207.29) | #66edff | hsl(187, 100%, 70%) |
|
|
300 | oklch(0.853 0.139 208.92) | #33e7ff | hsl(187, 100%, 60%) |
|
|
400 | oklch(0.835 0.145 211.68) | #00e1ff | hsl(187, 100%, 50%) |
|
|
500 | oklch(0.706 0.123 211.45) | #00b4cc | hsl(187, 100%, 40%) |
|
|
600 | oklch(0.626 0.109 210.94) | #0099ad | hsl(187, 100%, 34%) |
|
|
700 | oklch(0.544 0.094 211.15) | #007e8f | hsl(187, 100%, 28%) |
|
|
800 | oklch(0.458 0.079 210.33) | #006370 | hsl(187, 100%, 22%) |
|
|
900 | oklch(0.368 0.064 210.49) | #004852 | hsl(187, 100%, 16%) |
|
|
950 | oklch(0.272 0.047 208.59) | #002d33 | hsl(187, 100%, 10%) |
|
dsfds
50 | oklch(0.953 0.047 206.35) | #ccf9ff | hsl(187, 100%, 90%) |
|
|
100 | oklch(0.919 0.080 206.65) | #a3f4ff | hsl(187, 100%, 82%) |
|
|
200 | oklch(0.892 0.109 206.31) | #79f0ff | hsl(187, 100%, 74%) |
|
|
300 | oklch(0.868 0.129 207.47) | #50ebff | hsl(187, 100%, 66%) |
|
|
400 | oklch(0.849 0.141 209.19) | #26e6ff | hsl(187, 100%, 57%) |
|
|
500 | oklch(0.829 0.144 211.27) | #00dffc | hsl(187, 100%, 49%) |
|
|
600 | oklch(0.727 0.126 211.53) | #00bbd4 | hsl(187, 100%, 42%) |
|
|
700 | oklch(0.623 0.108 211.03) | #0098ac | hsl(187, 100%, 34%) |
|
|
800 | oklch(0.512 0.089 210.37) | #007483 | hsl(187, 100%, 26%) |
|
|
900 | oklch(0.398 0.069 209.06) | #00515b | hsl(187, 100%, 18%) |
|
|
950 | oklch(0.272 0.047 208.59) | #002d33 | hsl(187, 100%, 10%) |
|
Related palettes
Discover more palettes with a similar mood and vibe or Browse our collection.