Vibrant Summer Color Palette
This vibrant palette bursts with a sunny energy, featuring fresh greens, zesty yellows, and bold oranges that evoke a playful, adventurous spirit, punctuated by a striking pop of passionate red.
Practical uses and creative applications
The Vibrant Summer Color Palette is a lively fusion of bright yellows, striking oranges, and energetic greens that captures the essence of a sun-soaked day. Comprising shades like #ccf390, #e0e05a, #f7c41f, #fc930a, and #ff003d, this palette is perfect for designers looking to infuse their projects with a sense of joy and vitality.
Whether you're working on branding for a summer festival, designing an eye-catching website for a beach resort, or creating playful packaging for a new beverage line, this palette will evoke feelings of warmth and excitement. Ideal for creatives and designers targeting a youthful audience, the Vibrant Summer Color Palette suits a variety of styles, from modern and playful to bold and adventurous.
Its bright, cheerful hues can transform any space, making it a great choice for interior design projects aimed at creating inviting and energetic atmospheres. Use it to inspire your next project, whether it's in digital marketing, product design, or event branding, and watch as it brings your ideas to life with a burst of summer energy.
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.963 0.056 124.80) | #eafad1 | hsl(83, 80%, 90%) |
|
|
| 100 | oklch(0.953 0.073 125.32) | #e4f9c4 | hsl(84, 82%, 87%) |
|
|
| 200 | oklch(0.942 0.087 125.36) | #def7b7 | hsl(83, 80%, 84%) |
|
|
| 300 | oklch(0.933 0.103 125.83) | #d8f6aa | hsl(84, 81%, 82%) |
|
|
| 400 | oklch(0.923 0.117 125.97) | #d2f49d | hsl(83, 80%, 79%) |
|
|
| 500 | oklch(0.914 0.132 126.42) | #ccf390 | hsl(84, 80%, 76%) |
|
|
| 600 | oklch(0.873 0.190 128.21) | #b0ec53 | hsl(84, 80%, 63%) |
|
|
| 700 | oklch(0.835 0.222 130.84) | #94e419 | hsl(84, 80%, 50%) |
|
|
| 800 | oklch(0.663 0.175 130.45) | #6da712 | hsl(83, 81%, 36%) |
|
|
| 900 | oklch(0.481 0.124 130.38) | #456b0c | hsl(84, 80%, 23%) |
|
|
| 950 | oklch(0.277 0.066 128.66) | #1e2e05 | hsl(83, 80%, 10%) |
|
dsfds
| 50 | oklch(0.967 0.046 107.22) | #f7f7d4 | hsl(60, 69%, 90%) |
|
|
| 100 | oklch(0.948 0.070 107.66) | #f2f2bc | hsl(60, 68%, 84%) |
|
|
| 200 | oklch(0.932 0.095 108.11) | #eeeea3 | hsl(60, 69%, 79%) |
|
|
| 300 | oklch(0.914 0.117 108.50) | #e9e98b | hsl(60, 68%, 73%) |
|
|
| 400 | oklch(0.899 0.138 108.88) | #e5e572 | hsl(60, 69%, 67%) |
|
|
| 500 | oklch(0.882 0.154 109.19) | #e0e05a | hsl(60, 68%, 62%) |
|
|
| 600 | oklch(0.855 0.175 109.59) | #d8d82e | hsl(60, 69%, 51%) |
|
|
| 700 | oklch(0.734 0.151 109.61) | #b0b021 | hsl(60, 68%, 41%) |
|
|
| 800 | oklch(0.591 0.120 109.58) | #838319 | hsl(60, 68%, 31%) |
|
|
| 900 | oklch(0.443 0.089 109.53) | #575710 | hsl(60, 69%, 20%) |
|
|
| 950 | oklch(0.281 0.052 109.34) | #2b2b08 | hsl(60, 69%, 10%) |
|
dsfds
| 50 | oklch(0.961 0.048 93.00) | #fdf2ce | hsl(46, 92%, 90%) |
|
|
| 100 | oklch(0.935 0.082 93.07) | #fce9ab | hsl(46, 93%, 83%) |
|
|
| 200 | oklch(0.910 0.112 92.90) | #fbe088 | hsl(46, 93%, 76%) |
|
|
| 300 | oklch(0.884 0.137 92.19) | #f9d665 | hsl(46, 93%, 69%) |
|
|
| 400 | oklch(0.863 0.156 91.00) | #f8cd42 | hsl(46, 93%, 62%) |
|
|
| 500 | oklch(0.842 0.167 88.87) | #f7c41f | hsl(46, 93%, 55%) |
|
|
| 600 | oklch(0.774 0.157 86.59) | #e1ad08 | hsl(46, 93%, 46%) |
|
|
| 700 | oklch(0.661 0.134 87.51) | #b58c06 | hsl(46, 94%, 37%) |
|
|
| 800 | oklch(0.540 0.109 88.04) | #896a05 | hsl(46, 93%, 28%) |
|
|
| 900 | oklch(0.412 0.083 89.11) | #5d4803 | hsl(46, 94%, 19%) |
|
|
| 950 | oklch(0.274 0.054 91.35) | #312602 | hsl(46, 92%, 10%) |
|
dsfds
| 50 | oklch(0.944 0.043 75.10) | #fee9cd | hsl(34, 96%, 90%) |
|
|
| 100 | oklch(0.903 0.077 74.19) | #fed8a6 | hsl(34, 98%, 82%) |
|
|
| 200 | oklch(0.861 0.108 72.64) | #fdc67f | hsl(34, 97%, 75%) |
|
|
| 300 | oklch(0.824 0.137 70.74) | #fdb558 | hsl(34, 98%, 67%) |
|
|
| 400 | oklch(0.789 0.158 67.71) | #fca431 | hsl(34, 97%, 59%) |
|
|
| 500 | oklch(0.758 0.173 62.07) | #fc930a | hsl(34, 98%, 51%) |
|
|
| 600 | oklch(0.674 0.156 61.28) | #d97c03 | hsl(34, 97%, 43%) |
|
|
| 700 | oklch(0.576 0.132 62.02) | #af6402 | hsl(34, 98%, 35%) |
|
|
| 800 | oklch(0.475 0.108 62.53) | #864c02 | hsl(34, 97%, 27%) |
|
|
| 900 | oklch(0.369 0.082 65.73) | #5c3501 | hsl(34, 98%, 18%) |
|
|
| 950 | oklch(0.253 0.053 70.56) | #321d01 | hsl(34, 96%, 10%) |
|
dsfds
| 50 | oklch(0.893 0.060 2.64) | #ffccd8 | hsl(346, 100%, 90%) |
|
|
| 100 | oklch(0.813 0.112 4.31) | #ffa3b9 | hsl(346, 100%, 82%) |
|
|
| 200 | oklch(0.742 0.164 6.80) | #ff7a9a | hsl(346, 100%, 74%) |
|
|
| 300 | oklch(0.687 0.209 10.55) | #ff527b | hsl(346, 100%, 66%) |
|
|
| 400 | oklch(0.649 0.241 15.45) | #ff295c | hsl(346, 100%, 58%) |
|
|
| 500 | oklch(0.632 0.254 21.53) | #ff003d | hsl(346, 100%, 50%) |
|
|
| 600 | oklch(0.554 0.223 21.15) | #d60033 | hsl(346, 100%, 42%) |
|
|
| 700 | oklch(0.473 0.190 20.59) | #ad0029 | hsl(346, 100%, 34%) |
|
|
| 800 | oklch(0.390 0.157 19.37) | #850020 | hsl(346, 100%, 26%) |
|
|
| 900 | oklch(0.301 0.121 17.53) | #5c0016 | hsl(346, 100%, 18%) |
|
|
| 950 | oklch(0.205 0.082 12.99) | #33000c | hsl(346, 100%, 10%) |
|
Related palettes
Discover more palettes with a similar mood and vibe or Browse our collection.
