Vibrant Summer Color Palette
This vibrant palette radiates a playful energy with bold coral, earthy brown, fresh greens, and soft pastel yellow, evoking a cheerful, sun-kissed garden party atmosphere.
Practical uses and creative applications
The Vibrant Summer Color Palette is a delightful blend of lively hues that encapsulate the essence of summer. Featuring bold shades like #fb545c, a radiant coral red, and #99662d, a warm earthy brown, this palette is perfect for branding and web design projects that aim to evoke energy and positivity.
The refreshing greens of #b7e1a1 and #cdeda1, complemented by the sunny #fdf5a4, create a harmonious balance that can invigorate any design, making it ideal for outdoor brands, wellness products, and creative agencies looking to stand out. This palette is particularly suited for designers and creatives who want to convey a cheerful and approachable mood.
Whether you're working on packaging for a summer beverage, designing a vibrant website for a lifestyle blog, or refreshing the interiors of a trendy café, the Vibrant Summer Color Palette can bring an uplifting atmosphere to your projects. Its versatility allows it to cater to a broad audience, from fashion enthusiasts to eco-friendly businesses, ensuring that any creative endeavor feels fresh, inviting, and full of life.
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.891 0.056 15.50) | #fecdcf | hsl(358, 96%, 90%) |
|
|
100 | oklch(0.841 0.084 16.25) | #fdb5b8 | hsl(358, 95%, 85%) |
|
|
200 | oklch(0.795 0.115 17.29) | #fd9da1 | hsl(358, 96%, 80%) |
|
|
300 | oklch(0.749 0.146 18.09) | #fc848a | hsl(357, 95%, 75%) |
|
|
400 | oklch(0.710 0.176 19.81) | #fc6c73 | hsl(357, 96%, 71%) |
|
|
500 | oklch(0.676 0.203 21.77) | #fb545c | hsl(357, 95%, 66%) |
|
|
600 | oklch(0.627 0.245 26.76) | #fa1c27 | hsl(357, 96%, 55%) |
|
|
700 | oklch(0.556 0.226 28.21) | #d8050f | hsl(357, 95%, 43%) |
|
|
800 | oklch(0.447 0.181 27.90) | #a1040b | hsl(357, 95%, 32%) |
|
|
900 | oklch(0.329 0.132 27.01) | #690207 | hsl(357, 96%, 21%) |
|
|
950 | oklch(0.202 0.079 25.29) | #320103 | hsl(358, 96%, 10%) |
|
dsfds
50 | oklch(0.931 0.023 69.59) | #f3e6d8 | hsl(31, 53%, 90%) |
|
|
100 | oklch(0.863 0.050 70.03) | #e8cdaf | hsl(32, 55%, 80%) |
|
|
200 | oklch(0.795 0.076 69.70) | #dcb487 | hsl(32, 55%, 70%) |
|
|
300 | oklch(0.725 0.100 67.60) | #d09a5f | hsl(31, 55%, 59%) |
|
|
400 | oklch(0.656 0.118 66.12) | #c18139 | hsl(32, 54%, 49%) |
|
|
500 | oklch(0.554 0.098 66.14) | #99662d | hsl(32, 55%, 39%) |
|
|
600 | oklch(0.494 0.086 66.84) | #825726 | hsl(32, 55%, 33%) |
|
|
700 | oklch(0.434 0.074 66.42) | #6c4820 | hsl(32, 54%, 27%) |
|
|
800 | oklch(0.370 0.061 67.51) | #553919 | hsl(32, 55%, 22%) |
|
|
900 | oklch(0.301 0.048 66.75) | #3e2912 | hsl(31, 55%, 16%) |
|
|
950 | oklch(0.230 0.032 67.19) | #271a0c | hsl(31, 53%, 10%) |
|
dsfds
50 | oklch(0.944 0.041 135.04) | #e1f3d8 | hsl(100, 53%, 90%) |
|
|
100 | oklch(0.927 0.051 134.44) | #d9efcd | hsl(99, 52%, 87%) |
|
|
200 | oklch(0.912 0.063 135.19) | #d0ecc2 | hsl(100, 53%, 84%) |
|
|
300 | oklch(0.895 0.074 134.81) | #c8e8b7 | hsl(99, 52%, 81%) |
|
|
400 | oklch(0.880 0.086 135.36) | #bfe5ac | hsl(100, 52%, 79%) |
|
|
500 | oklch(0.864 0.096 135.12) | #b7e1a1 | hsl(99, 52%, 76%) |
|
|
600 | oklch(0.794 0.147 135.76) | #90d16e | hsl(99, 52%, 63%) |
|
|
700 | oklch(0.725 0.184 136.72) | #6abf3d | hsl(99, 52%, 49%) |
|
|
800 | oklch(0.578 0.143 136.57) | #4e8c2d | hsl(99, 51%, 36%) |
|
|
900 | oklch(0.420 0.100 136.72) | #31591d | hsl(100, 51%, 23%) |
|
|
950 | oklch(0.249 0.053 136.34) | #15270c | hsl(100, 53%, 10%) |
|
dsfds
50 | oklch(0.956 0.049 126.24) | #e8f7d4 | hsl(86, 69%, 90%) |
|
|
100 | oklch(0.946 0.060 126.02) | #e3f5ca | hsl(85, 68%, 88%) |
|
|
200 | oklch(0.935 0.071 126.71) | #ddf3c0 | hsl(86, 68%, 85%) |
|
|
300 | oklch(0.925 0.083 126.34) | #d8f1b5 | hsl(85, 68%, 83%) |
|
|
400 | oklch(0.915 0.094 126.93) | #d2efab | hsl(86, 68%, 80%) |
|
|
500 | oklch(0.905 0.105 126.93) | #cdeda1 | hsl(85, 68%, 78%) |
|
|
600 | oklch(0.851 0.162 128.49) | #aee267 | hsl(85, 68%, 65%) |
|
|
700 | oklch(0.802 0.203 130.75) | #8fd72d | hsl(85, 68%, 51%) |
|
|
800 | oklch(0.641 0.162 130.66) | #699f1f | hsl(85, 67%, 37%) |
|
|
900 | oklch(0.464 0.114 130.09) | #436513 | hsl(85, 68%, 24%) |
|
|
950 | oklch(0.267 0.059 129.55) | #1c2b08 | hsl(86, 69%, 10%) |
|
dsfds
50 | oklch(0.977 0.058 103.21) | #fefacd | hsl(55, 96%, 90%) |
|
|
100 | oklch(0.973 0.067 102.99) | #fef9c5 | hsl(55, 97%, 88%) |
|
|
200 | oklch(0.970 0.076 102.84) | #fef8bd | hsl(54, 97%, 87%) |
|
|
300 | oklch(0.965 0.085 103.55) | #fdf7b4 | hsl(55, 95%, 85%) |
|
|
400 | oklch(0.962 0.093 103.41) | #fdf6ac | hsl(55, 95%, 83%) |
|
|
500 | oklch(0.958 0.101 103.30) | #fdf5a4 | hsl(55, 96%, 82%) |
|
|
600 | oklch(0.931 0.162 103.80) | #fbed5c | hsl(55, 95%, 67%) |
|
|
700 | oklch(0.911 0.188 102.60) | #fae515 | hsl(54, 96%, 53%) |
|
|
800 | oklch(0.748 0.156 102.45) | #c1b004 | hsl(55, 96%, 39%) |
|
|
900 | oklch(0.535 0.111 102.53) | #7a6f03 | hsl(54, 95%, 25%) |
|
|
950 | oklch(0.296 0.062 104.25) | #322e01 | hsl(55, 96%, 10%) |
|
Related palettes
Discover more palettes with a similar mood and vibe or Browse our collection.