Coastal Summer Color Palette
This vibrant palette radiates a fresh coastal energy with its cool aquas and soft greens, accented by warm sunset oranges, evoking a lively, cheerful summer vibe perfect for playful, modern aesthetics.
Practical uses and creative applications
The Coastal Summer Color Palette is a refreshing blend of vibrant hues that evokes the serene beauty of sun-kissed beaches and crystal-clear waters. Featuring shades like #69d2e7 and #f38630, this palette is ideal for brands looking to capture the essence of summer and the ocean's tranquility.
It's perfect for web design, packaging, and branding projects aimed at outdoor lifestyle brands, travel companies, or wellness products. Designers can leverage these colors to create inviting visuals that resonate with audiences seeking a laid-back, beachy vibe.
This color palette is not only versatile but also suits a variety of styles and moods, from playful and energetic to calm and soothing. The combination of cool blues and warm oranges creates a balanced aesthetic that can enhance interiors, making it a fantastic choice for coastal-themed spaces or summer retreats.
Whether you're a creative looking to refresh a client's branding or a DIY enthusiast reimagining your living space, the Coastal Summer Color Palette will inspire a sense of joy and relaxation. Embrace these colors to transport your audience to a sun-soaked paradise, making your projects unforgettable.
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.941 0.033 210.63) | #d3f2f8 | hsl(190, 73%, 90%) |
|
|
| 100 | oklch(0.912 0.048 212.72) | #beebf5 | hsl(191, 73%, 85%) |
|
|
| 200 | oklch(0.885 0.063 211.31) | #a9e5f1 | hsl(190, 72%, 80%) |
|
|
| 300 | oklch(0.859 0.078 211.38) | #93dfee | hsl(190, 73%, 75%) |
|
|
| 400 | oklch(0.832 0.090 211.93) | #7ed8ea | hsl(190, 72%, 71%) |
|
|
| 500 | oklch(0.809 0.101 212.44) | #69d2e7 | hsl(190, 72%, 66%) |
|
|
| 600 | oklch(0.757 0.120 214.60) | #38c3df | hsl(190, 72%, 55%) |
|
|
| 700 | oklch(0.667 0.112 215.11) | #1fa5bf | hsl(190, 72%, 44%) |
|
|
| 800 | oklch(0.536 0.089 215.55) | #177a8e | hsl(190, 72%, 32%) |
|
|
| 900 | oklch(0.399 0.065 214.83) | #0f505d | hsl(190, 72%, 21%) |
|
|
| 950 | oklch(0.249 0.037 212.96) | #07262c | hsl(190, 73%, 10%) |
|
dsfds
| 50 | oklch(0.939 0.022 193.31) | #dbf0ef | hsl(177, 41%, 90%) |
|
|
| 100 | oklch(0.922 0.030 191.41) | #d0ecea | hsl(176, 42%, 87%) |
|
|
| 200 | oklch(0.906 0.036 192.18) | #c6e8e6 | hsl(176, 43%, 84%) |
|
|
| 300 | oklch(0.887 0.041 192.61) | #bce3e1 | hsl(177, 41%, 81%) |
|
|
| 400 | oklch(0.871 0.048 193.02) | #b1dfdd | hsl(177, 42%, 78%) |
|
|
| 500 | oklch(0.855 0.054 191.78) | #a7dbd8 | hsl(177, 42%, 76%) |
|
|
| 600 | oklch(0.780 0.080 190.57) | #77c8c3 | hsl(176, 42%, 63%) |
|
|
| 700 | oklch(0.704 0.097 190.02) | #49b3ad | hsl(177, 42%, 49%) |
|
|
| 800 | oklch(0.561 0.076 190.54) | #36837f | hsl(177, 42%, 36%) |
|
|
| 900 | oklch(0.411 0.054 189.95) | #225451 | hsl(176, 42%, 23%) |
|
|
| 950 | oklch(0.243 0.027 191.50) | #0f2423 | hsl(177, 41%, 10%) |
|
dsfds
| 50 | oklch(0.940 0.020 112.94) | #ebedde | hsl(68, 29%, 90%) |
|
|
| 100 | oklch(0.934 0.023 112.28) | #e9ebda | hsl(67, 30%, 89%) |
|
|
| 200 | oklch(0.929 0.026 116.56) | #e6ead7 | hsl(73, 31%, 88%) |
|
|
| 300 | oklch(0.922 0.028 115.71) | #e4e8d3 | hsl(71, 31%, 87%) |
|
|
| 400 | oklch(0.916 0.030 115.35) | #e2e6d0 | hsl(71, 31%, 86%) |
|
|
| 500 | oklch(0.909 0.032 114.72) | #e0e4cc | hsl(70, 31%, 85%) |
|
|
| 600 | oklch(0.821 0.065 115.54) | #c2ca9a | hsl(70, 31%, 70%) |
|
|
| 700 | oklch(0.728 0.095 116.67) | #a3af68 | hsl(70, 31%, 55%) |
|
|
| 800 | oklch(0.594 0.087 116.55) | #7b8546 | hsl(70, 31%, 40%) |
|
|
| 900 | oklch(0.427 0.059 116.14) | #4d532c | hsl(69, 31%, 25%) |
|
|
| 950 | oklch(0.241 0.027 114.63) | #1f2112 | hsl(68, 29%, 10%) |
|
dsfds
| 50 | oklch(0.931 0.038 60.99) | #fce3cf | hsl(27, 88%, 90%) |
|
|
| 100 | oklch(0.885 0.065 59.98) | #fad0af | hsl(26, 88%, 83%) |
|
|
| 200 | oklch(0.844 0.092 59.65) | #f9be8f | hsl(27, 90%, 77%) |
|
|
| 300 | oklch(0.802 0.117 57.92) | #f7ab70 | hsl(26, 89%, 70%) |
|
|
| 400 | oklch(0.764 0.141 56.85) | #f59950 | hsl(27, 89%, 64%) |
|
|
| 500 | oklch(0.727 0.163 53.98) | #f38630 | hsl(26, 89%, 57%) |
|
|
| 600 | oklch(0.668 0.174 49.57) | #e66d0d | hsl(27, 89%, 48%) |
|
|
| 700 | oklch(0.568 0.146 49.92) | #b8570b | hsl(26, 89%, 38%) |
|
|
| 800 | oklch(0.465 0.117 50.96) | #8b4208 | hsl(27, 89%, 29%) |
|
|
| 900 | oklch(0.355 0.087 51.97) | #5e2c05 | hsl(26, 90%, 19%) |
|
|
| 950 | oklch(0.236 0.051 57.17) | #301703 | hsl(27, 88%, 10%) |
|
dsfds
| 50 | oklch(0.929 0.043 57.14) | #ffe1cc | hsl(25, 100%, 90%) |
|
|
| 100 | oklch(0.874 0.080 57.28) | #ffc9a2 | hsl(25, 100%, 82%) |
|
|
| 200 | oklch(0.823 0.117 56.44) | #ffb178 | hsl(25, 100%, 74%) |
|
|
| 300 | oklch(0.776 0.151 54.22) | #ff994f | hsl(25, 100%, 65%) |
|
|
| 400 | oklch(0.733 0.180 50.12) | #ff8025 | hsl(25, 100%, 57%) |
|
|
| 500 | oklch(0.692 0.197 45.18) | #fa6900 | hsl(25, 100%, 49%) |
|
|
| 600 | oklch(0.608 0.172 45.60) | #d25800 | hsl(25, 100%, 41%) |
|
|
| 700 | oklch(0.523 0.145 46.71) | #aa4800 | hsl(25, 100%, 33%) |
|
|
| 800 | oklch(0.434 0.119 47.53) | #833700 | hsl(25, 100%, 26%) |
|
|
| 900 | oklch(0.339 0.090 49.47) | #5b2600 | hsl(25, 100%, 18%) |
|
|
| 950 | oklch(0.236 0.059 54.21) | #331500 | hsl(25, 100%, 10%) |
|
Related palettes
Discover more palettes with a similar mood and vibe or Browse our collection.
