Vibrant Coastal Color Palette
This palette exudes a vibrant coastal energy with deep teal and seafoam green, contrasted by bold crimson and rich burgundy, creating a dynamic yet moody atmosphere full of passion and intensity.
Practical uses and creative applications
The Vibrant Coastal Color Palette brings the refreshing essence of the seaside into your projects, making it an ideal choice for designers looking to evoke a sense of adventure and tranquility. Featuring rich hues like #387D7D and #57BCBE, this palette is perfect for branding, web design, and packaging that targets the travel, lifestyle, or health industries.
The deep coral #BB2921 and earthy tones of #71110A and #370504 add depth and sophistication, creating a captivating visual experience that resonates with audiences seeking innovation and authenticity. This color palette is particularly suited for creatives who want to convey a relaxed yet invigorating mood in their interiors or outdoor spaces.
Whether you're designing a beach resort's branding or refreshing a café's ambiance, the vibrant coastal colors can enhance the atmosphere, inviting customers to unwind and explore. Ideal for graphic designers, interior decorators, and branding experts, the Vibrant Coastal Color Palette offers versatility and flair, making it a must-have for projects that aim to inspire and delight.
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.938 0.020 196.82) | #dcefef | hsl(180, 37%, 90%) |
|
|
| 100 | oklch(0.871 0.043 196.39) | #b5dede | hsl(180, 38%, 79%) |
|
|
| 200 | oklch(0.806 0.063 195.97) | #8fcdcd | hsl(180, 38%, 68%) |
|
|
| 300 | oklch(0.743 0.081 195.55) | #69bcbc | hsl(180, 38%, 57%) |
|
|
| 400 | oklch(0.661 0.085 195.28) | #49a3a3 | hsl(180, 38%, 46%) |
|
|
| 500 | oklch(0.546 0.069 195.31) | #387d7d | hsl(180, 38%, 35%) |
|
|
| 600 | oklch(0.489 0.061 195.34) | #306b6b | hsl(180, 38%, 30%) |
|
|
| 700 | oklch(0.430 0.053 195.37) | #285959 | hsl(180, 38%, 25%) |
|
|
| 800 | oklch(0.370 0.044 195.41) | #204747 | hsl(180, 38%, 20%) |
|
|
| 900 | oklch(0.307 0.035 195.48) | #183535 | hsl(180, 38%, 15%) |
|
|
| 950 | oklch(0.240 0.025 195.62) | #102323 | hsl(180, 37%, 10%) |
|
dsfds
| 50 | oklch(0.939 0.023 200.08) | #daf0f1 | hsl(183, 45%, 90%) |
|
|
| 100 | oklch(0.898 0.040 198.44) | #c0e6e7 | hsl(182, 45%, 83%) |
|
|
| 200 | oklch(0.855 0.054 197.63) | #a6dbdc | hsl(181, 44%, 76%) |
|
|
| 300 | oklch(0.815 0.070 197.00) | #8bd1d2 | hsl(181, 44%, 68%) |
|
|
| 400 | oklch(0.774 0.083 197.55) | #71c6c8 | hsl(181, 44%, 61%) |
|
|
| 500 | oklch(0.736 0.094 197.07) | #57bcbe | hsl(181, 44%, 54%) |
|
|
| 600 | oklch(0.665 0.092 197.03) | #41a5a7 | hsl(181, 44%, 45%) |
|
|
| 700 | oklch(0.569 0.078 197.46) | #348587 | hsl(181, 44%, 37%) |
|
|
| 800 | oklch(0.467 0.063 196.69) | #276566 | hsl(181, 45%, 28%) |
|
|
| 900 | oklch(0.361 0.046 195.29) | #1b4545 | hsl(180, 44%, 19%) |
|
|
| 950 | oklch(0.243 0.028 199.36) | #0e2425 | hsl(183, 45%, 10%) |
|
dsfds
| 50 | oklch(0.903 0.037 21.99) | #f7d6d4 | hsl(3, 69%, 90%) |
|
|
| 100 | oklch(0.814 0.077 22.87) | #f0afab | hsl(3, 70%, 81%) |
|
|
| 200 | oklch(0.729 0.120 24.18) | #e98882 | hsl(3, 70%, 71%) |
|
|
| 300 | oklch(0.653 0.163 25.68) | #e2615a | hsl(3, 70%, 62%) |
|
|
| 400 | oklch(0.591 0.199 28.15) | #db3a31 | hsl(3, 70%, 53%) |
|
|
| 500 | oklch(0.519 0.183 28.58) | #bb2921 | hsl(3, 70%, 43%) |
|
|
| 600 | oklch(0.460 0.160 28.52) | #9e231c | hsl(3, 70%, 36%) |
|
|
| 700 | oklch(0.400 0.138 28.12) | #821c17 | hsl(3, 70%, 30%) |
|
|
| 800 | oklch(0.337 0.113 27.87) | #651612 | hsl(3, 70%, 23%) |
|
|
| 900 | oklch(0.271 0.086 27.45) | #48100d | hsl(3, 69%, 17%) |
|
|
| 950 | oklch(0.202 0.055 26.87) | #2b0a08 | hsl(3, 69%, 10%) |
|
dsfds
| 50 | oklch(0.900 0.045 23.08) | #fbd3d0 | hsl(4, 84%, 90%) |
|
|
| 100 | oklch(0.775 0.112 24.66) | #f59992 | hsl(4, 83%, 77%) |
|
|
| 200 | oklch(0.670 0.181 26.98) | #f05f55 | hsl(4, 84%, 64%) |
|
|
| 300 | oklch(0.601 0.229 29.66) | #ea2517 | hsl(4, 83%, 50%) |
|
|
| 400 | oklch(0.484 0.184 29.70) | #af1a0f | hsl(4, 84%, 37%) |
|
|
| 500 | oklch(0.356 0.131 29.49) | #71110a | hsl(4, 84%, 24%) |
|
|
| 600 | oklch(0.327 0.119 29.34) | #640f09 | hsl(4, 83%, 21%) |
|
|
| 700 | oklch(0.298 0.107 29.17) | #570d08 | hsl(4, 83%, 19%) |
|
|
| 800 | oklch(0.267 0.093 29.71) | #490b06 | hsl(4, 85%, 15%) |
|
|
| 900 | oklch(0.236 0.080 29.79) | #3c0905 | hsl(4, 85%, 13%) |
|
|
| 950 | oklch(0.205 0.066 29.87) | #2f0704 | hsl(4, 84%, 10%) |
|
dsfds
| 50 | oklch(0.895 0.050 19.66) | #fcd0cf | hsl(1, 88%, 90%) |
|
|
| 100 | oklch(0.744 0.136 21.93) | #f68785 | hsl(1, 86%, 74%) |
|
|
| 200 | oklch(0.634 0.216 26.88) | #f13e3a | hsl(1, 87%, 59%) |
|
|
| 300 | oklch(0.536 0.212 28.90) | #cc130f | hsl(1, 86%, 43%) |
|
|
| 400 | oklch(0.387 0.150 28.73) | #820c09 | hsl(1, 87%, 27%) |
|
|
| 500 | oklch(0.220 0.079 27.88) | #370504 | hsl(1, 86%, 12%) |
|
|
| 600 | oklch(0.217 0.078 27.84) | #360504 | hsl(1, 86%, 11%) |
|
|
| 700 | oklch(0.213 0.075 27.77) | #340504 | hsl(1, 86%, 11%) |
|
|
| 800 | oklch(0.211 0.074 27.73) | #330504 | hsl(1, 85%, 11%) |
|
|
| 900 | oklch(0.204 0.073 26.62) | #310404 | hsl(0, 85%, 10%) |
|
|
| 950 | oklch(0.202 0.072 28.18) | #300403 | hsl(1, 88%, 10%) |
|
Related palettes
Discover more palettes with a similar mood and vibe or Browse our collection.
