Vibrant Coastal Color Palette
This palette radiates a sunny, vibrant energy with warm golden hues mingling with cool teal tones, evoking a playful yet sophisticated coastal vibe.
Practical uses and creative applications
The Vibrant Coastal Color Palette is a stunning combination of soft sandy hues and rich oceanic tones, perfectly crafted to evoke the refreshing essence of seaside living. Featuring the radiant shades of #FAF6D8, #F9D308, #D0AC33, #027B96, and #00647F, this palette is ideal for designers looking to create a bright and inviting atmosphere.
Whether you’re working on branding for a beachside café, web design for a travel blog, or packaging for eco-friendly products, these colors will bring a sense of warmth and vitality to your projects. This palette is particularly suited for creatives targeting audiences who appreciate vibrant aesthetics and a connection to nature.
Interior designers can use the Vibrant Coastal Color Palette to infuse spaces with a breezy, coastal vibe, perfect for modern homes or vacation rentals. Its lively yet calming colors work harmoniously to promote relaxation and enjoyment, making it an excellent choice for projects that aim to inspire happiness and a sense of escape.
With its versatility and engaging energy, this palette is a must-have for anyone looking to make a splash in their creative endeavors.
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.964 0.046 101.85) | #f9f5d2 | hsl(54, 76%, 90%) |
|
|
| 100 | oklch(0.965 0.044 101.67) | #f9f5d3 | hsl(54, 76%, 90%) |
|
|
| 200 | oklch(0.966 0.043 100.06) | #faf5d4 | hsl(52, 79%, 91%) |
|
|
| 300 | oklch(0.966 0.041 99.58) | #faf5d6 | hsl(52, 78%, 91%) |
|
|
| 400 | oklch(0.968 0.041 101.08) | #faf6d7 | hsl(53, 78%, 91%) |
|
|
| 500 | oklch(0.968 0.039 100.86) | #faf6d8 | hsl(53, 77%, 91%) |
|
|
| 600 | oklch(0.913 0.109 101.44) | #f1e58e | hsl(53, 78%, 75%) |
|
|
| 700 | oklch(0.861 0.157 101.57) | #e7d445 | hsl(53, 77%, 59%) |
|
|
| 800 | oklch(0.741 0.150 101.09) | #c0ad19 | hsl(53, 77%, 43%) |
|
|
| 900 | oklch(0.523 0.104 101.15) | #776b0f | hsl(53, 78%, 26%) |
|
|
| 950 | oklch(0.277 0.052 102.77) | #2d2906 | hsl(54, 76%, 10%) |
|
| 50 | oklch(0.969 0.054 98.14) | #fef6cd | hsl(50, 96%, 90%) |
|
|
| 100 | oklch(0.947 0.093 98.63) | #fdefa6 | hsl(50, 96%, 82%) |
|
|
| 200 | oklch(0.926 0.129 98.86) | #fce87e | hsl(50, 95%, 74%) |
|
|
| 300 | oklch(0.907 0.156 98.51) | #fbe157 | hsl(50, 95%, 66%) |
|
|
| 400 | oklch(0.889 0.173 97.57) | #fada2f | hsl(51, 95%, 58%) |
|
|
| 500 | oklch(0.873 0.179 95.73) | #f9d308 | hsl(51, 95%, 50%) |
|
|
| 600 | oklch(0.770 0.157 95.48) | #d3b205 | hsl(50, 95%, 42%) |
|
|
| 700 | oklch(0.657 0.134 96.08) | #aa9004 | hsl(51, 95%, 34%) |
|
|
| 800 | oklch(0.541 0.111 96.32) | #826e03 | hsl(51, 95%, 26%) |
|
|
| 900 | oklch(0.418 0.085 96.75) | #5a4c02 | hsl(50, 96%, 18%) |
|
|
| 950 | oklch(0.285 0.058 97.74) | #322a01 | hsl(50, 96%, 10%) |
|
| 50 | oklch(0.948 0.032 93.52) | #f5eed6 | hsl(46, 61%, 90%) |
|
|
| 100 | oklch(0.909 0.059 93.54) | #eee1b5 | hsl(46, 63%, 82%) |
|
|
| 200 | oklch(0.870 0.083 94.06) | #e6d495 | hsl(47, 62%, 74%) |
|
|
| 300 | oklch(0.830 0.106 92.95) | #dfc674 | hsl(46, 63%, 66%) |
|
|
| 400 | oklch(0.792 0.125 92.80) | #d7b954 | hsl(46, 62%, 59%) |
|
|
| 500 | oklch(0.756 0.139 91.53) | #d0ac33 | hsl(46, 63%, 51%) |
|
|
| 600 | oklch(0.670 0.123 91.60) | #b19229 | hsl(46, 62%, 43%) |
|
|
| 700 | oklch(0.574 0.105 91.80) | #8f7621 | hsl(46, 63%, 35%) |
|
|
| 800 | oklch(0.474 0.085 92.11) | #6d5a19 | hsl(46, 63%, 26%) |
|
|
| 900 | oklch(0.368 0.064 92.62) | #4b3e11 | hsl(47, 63%, 18%) |
|
|
| 950 | oklch(0.254 0.039 93.14) | #29220a | hsl(46, 61%, 10%) |
|
| 50 | oklch(0.945 0.043 212.85) | #cdf5fe | hsl(191, 96%, 90%) |
|
|
| 100 | oklch(0.887 0.090 213.46) | #90eafe | hsl(191, 98%, 78%) |
|
|
| 200 | oklch(0.838 0.125 215.51) | #53defd | hsl(191, 98%, 66%) |
|
|
| 300 | oklch(0.799 0.142 219.60) | #17d2fc | hsl(191, 97%, 54%) |
|
|
| 400 | oklch(0.692 0.127 221.04) | #03add3 | hsl(191, 97%, 42%) |
|
|
| 500 | oklch(0.540 0.098 220.38) | #027b96 | hsl(191, 97%, 30%) |
|
|
| 600 | oklch(0.488 0.088 219.62) | #026b82 | hsl(191, 97%, 26%) |
|
|
| 700 | oklch(0.433 0.078 219.84) | #015a6e | hsl(191, 98%, 22%) |
|
|
| 800 | oklch(0.378 0.068 218.67) | #014a5a | hsl(191, 98%, 18%) |
|
|
| 900 | oklch(0.322 0.057 216.96) | #013a46 | hsl(190, 97%, 14%) |
|
|
| 950 | oklch(0.259 0.045 216.77) | #012932 | hsl(191, 96%, 10%) |
|
| 50 | oklch(0.942 0.044 216.23) | #ccf4ff | hsl(193, 100%, 90%) |
|
|
| 100 | oklch(0.876 0.094 217.20) | #8ae6ff | hsl(193, 100%, 77%) |
|
|
| 200 | oklch(0.822 0.131 219.88) | #47d8ff | hsl(193, 100%, 64%) |
|
|
| 300 | oklch(0.781 0.148 225.53) | #05caff | hsl(193, 100%, 51%) |
|
|
| 400 | oklch(0.633 0.121 225.60) | #0098c1 | hsl(193, 100%, 38%) |
|
|
| 500 | oklch(0.468 0.088 224.57) | #00647f | hsl(193, 100%, 25%) |
|
|
| 600 | oklch(0.428 0.081 224.41) | #005870 | hsl(193, 100%, 22%) |
|
|
| 700 | oklch(0.387 0.073 224.20) | #004c61 | hsl(193, 100%, 19%) |
|
|
| 800 | oklch(0.345 0.064 222.58) | #004051 | hsl(193, 100%, 16%) |
|
|
| 900 | oklch(0.301 0.056 221.94) | #003442 | hsl(193, 100%, 13%) |
|
|
| 950 | oklch(0.256 0.047 221.02) | #002833 | hsl(193, 100%, 10%) |
|
Related palettes
Discover more palettes with a similar mood and vibe or Browse our collection
