Vibrant Summer Color Palette
This palette radiates a fresh and vibrant energy, blending soft pastel greens and creamy yellows with bold coral and fuchsia, creating an uplifting and playful summer vibe.
Practical uses and creative applications
The Vibrant Summer Color Palette is a delightful blend of warm hues that evoke the essence of a sun-soaked day. Featuring soft yellows (#fbffcc), refreshing greens (#caf2be), warm taupes (#ddc996), and bold pinks (#f67975 and #f13565), this palette is ideal for creatives looking to infuse energy and joy into their projects.
Whether you’re a graphic designer crafting eye-catching branding materials or a web designer aiming to create a lively user experience, these colors can elevate your work and resonate with your audience. This palette is perfect for businesses in the food, fashion, or wellness industries, where a vibrant aesthetic can attract customers and convey a sense of happiness and vitality.
Imagine using the Vibrant Summer Color Palette for packaging design that stands out on shelves or for interior decor that transforms a space into a cheerful retreat. Its playful yet sophisticated blend is also great for summer event promotions, making it an excellent choice for designers looking to capture the spirit of the season in their work.
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.984 0.066 111.24) | #fbffcc | hsl(65, 100%, 90%) |
|
|
100 | oklch(0.984 0.066 111.24) | #fbffcc | hsl(65, 100%, 90%) |
|
|
200 | oklch(0.984 0.066 111.24) | #fbffcc | hsl(65, 100%, 90%) |
|
|
300 | oklch(0.984 0.066 111.24) | #fbffcc | hsl(65, 100%, 90%) |
|
|
400 | oklch(0.984 0.066 111.24) | #fbffcc | hsl(65, 100%, 90%) |
|
|
500 | oklch(0.984 0.066 111.24) | #fbffcc | hsl(65, 100%, 90%) |
|
|
600 | oklch(0.967 0.157 112.86) | #f5ff7a | hsl(65, 100%, 74%) |
|
|
700 | oklch(0.955 0.208 114.65) | #eeff29 | hsl(65, 100%, 58%) |
|
|
800 | oklch(0.834 0.190 115.42) | #c5d600 | hsl(65, 100%, 42%) |
|
|
900 | oklch(0.587 0.134 115.44) | #7a8500 | hsl(65, 100%, 26%) |
|
|
950 | oklch(0.307 0.069 114.47) | #2f3300 | hsl(65, 100%, 10%) |
|
dsfds
50 | oklch(0.948 0.053 139.25) | #dcf7d5 | hsl(108, 68%, 90%) |
|
|
100 | oklch(0.942 0.059 138.29) | #d9f6d0 | hsl(106, 68%, 89%) |
|
|
200 | oklch(0.936 0.064 138.84) | #d5f5cc | hsl(107, 67%, 88%) |
|
|
300 | oklch(0.930 0.070 138.76) | #d1f4c7 | hsl(107, 67%, 87%) |
|
|
400 | oklch(0.925 0.075 138.56) | #cef3c3 | hsl(106, 67%, 86%) |
|
|
500 | oklch(0.919 0.081 138.52) | #caf2be | hsl(106, 67%, 85%) |
|
|
600 | oklch(0.847 0.156 138.90) | #96e57f | hsl(106, 66%, 70%) |
|
|
700 | oklch(0.787 0.218 139.55) | #62d93f | hsl(106, 67%, 55%) |
|
|
800 | oklch(0.652 0.193 139.89) | #41aa22 | hsl(106, 67%, 40%) |
|
|
900 | oklch(0.464 0.134 139.59) | #296a15 | hsl(106, 67%, 25%) |
|
|
950 | oklch(0.259 0.066 139.71) | #102b09 | hsl(108, 65%, 10%) |
|
dsfds
50 | oklch(0.941 0.027 87.86) | #f3ebd8 | hsl(42, 53%, 90%) |
|
|
100 | oklch(0.920 0.035 88.78) | #eee4cb | hsl(43, 51%, 86%) |
|
|
200 | oklch(0.902 0.044 89.90) | #eadebe | hsl(44, 51%, 83%) |
|
|
300 | oklch(0.882 0.053 89.04) | #e6d7b1 | hsl(43, 51%, 80%) |
|
|
400 | oklch(0.860 0.062 89.79) | #e1d0a3 | hsl(44, 51%, 76%) |
|
|
500 | oklch(0.840 0.070 89.11) | #ddc996 | hsl(43, 51%, 73%) |
|
|
600 | oklch(0.767 0.099 88.62) | #cdb066 | hsl(43, 51%, 60%) |
|
|
700 | oklch(0.685 0.115 87.45) | #b8953b | hsl(43, 51%, 48%) |
|
|
800 | oklch(0.547 0.089 87.11) | #876d2c | hsl(43, 51%, 35%) |
|
|
900 | oklch(0.403 0.063 87.15) | #57461c | hsl(43, 51%, 23%) |
|
|
950 | oklch(0.243 0.034 86.99) | #271f0c | hsl(42, 53%, 10%) |
|
dsfds
50 | oklch(0.897 0.049 21.23) | #fcd1cf | hsl(3, 88%, 90%) |
|
|
100 | oklch(0.858 0.069 20.80) | #fbbfbd | hsl(2, 89%, 86%) |
|
|
200 | oklch(0.822 0.090 21.72) | #faaeab | hsl(2, 89%, 83%) |
|
|
300 | oklch(0.785 0.111 21.91) | #f89c99 | hsl(2, 87%, 79%) |
|
|
400 | oklch(0.752 0.132 22.92) | #f78b87 | hsl(2, 88%, 75%) |
|
|
500 | oklch(0.720 0.154 23.55) | #f67975 | hsl(2, 88%, 71%) |
|
|
600 | oklch(0.637 0.215 27.27) | #f2403a | hsl(2, 88%, 59%) |
|
|
700 | oklch(0.575 0.228 29.10) | #e0150f | hsl(2, 87%, 47%) |
|
|
800 | oklch(0.459 0.180 29.04) | #a5100b | hsl(2, 88%, 35%) |
|
|
900 | oklch(0.336 0.128 28.77) | #6a0a07 | hsl(2, 88%, 22%) |
|
|
950 | oklch(0.204 0.071 29.26) | #300503 | hsl(3, 88%, 10%) |
|
dsfds
50 | oklch(0.896 0.053 0.41) | #fccfdb | hsl(344, 88%, 90%) |
|
|
100 | oklch(0.832 0.089 2.35) | #fab0c3 | hsl(345, 88%, 84%) |
|
|
200 | oklch(0.773 0.125 3.83) | #f792ac | hsl(345, 86%, 77%) |
|
|
300 | oklch(0.717 0.162 6.11) | #f57394 | hsl(345, 87%, 71%) |
|
|
400 | oklch(0.670 0.196 8.54) | #f3547d | hsl(345, 87%, 64%) |
|
|
500 | oklch(0.634 0.221 12.26) | #f13565 | hsl(345, 87%, 58%) |
|
|
600 | oklch(0.588 0.230 17.72) | #e51046 | hsl(345, 87%, 48%) |
|
|
700 | oklch(0.500 0.195 17.31) | #b80d38 | hsl(345, 87%, 39%) |
|
|
800 | oklch(0.409 0.157 16.19) | #8b0a2b | hsl(345, 87%, 29%) |
|
|
900 | oklch(0.309 0.117 14.31) | #5d061d | hsl(344, 88%, 19%) |
|
|
950 | oklch(0.203 0.073 9.94) | #30030f | hsl(344, 88%, 10%) |
|
Related palettes
Discover more palettes with a similar mood and vibe or Browse our collection.