Warm Serenity Color Palette
This palette radiates a warm, sunlit serenity with its buttery yellows, soft creams, and earthy greens, evoking a tranquil garden retreat infused with rustic charm.
Practical uses and creative applications
The Warm Serenity Color Palette is a harmonious blend of soft yellows, gentle greens, and muted earthy tones, making it an ideal choice for designers seeking to create a tranquil and inviting atmosphere. The palette features a warm yellow (#ffc870) that radiates positivity, complemented by a light, creamy beige (#f7f7c6) for a soothing backdrop.
The soft green shades (#c8e3c5 and #9cad9a) add a touch of nature, while the deep, rich brown (#755858) grounds the palette, providing balance and depth. This versatile combination is perfect for branding projects that aim to convey warmth and approachability, making it particularly appealing for wellness brands, organic products, and lifestyle blogs.
In web design, the Warm Serenity Palette can be used to create serene user experiences, enhancing the visual appeal of websites for spa services, eco-friendly companies, or artisanal shops. Interior designers can leverage these colors to craft calming spaces in homes, offices, or wellness centers, promoting relaxation and comfort.
This palette is also ideal for packaging designs that target environmentally conscious consumers, as its natural tones evoke a sense of sustainability. Whether you're a graphic designer, web developer, or creative entrepreneur, the Warm Serenity Color Palette offers a perfect blend of style and mood to elevate your projects and resonate with your audience.
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.948 0.046 78.85) | #ffebcc | hsl(36, 100%, 90%) |
|
|
100 | oklch(0.931 0.062 78.76) | #ffe4ba | hsl(37, 100%, 86%) |
|
|
200 | oklch(0.913 0.079 79.02) | #ffdda7 | hsl(37, 100%, 83%) |
|
|
300 | oklch(0.897 0.094 78.63) | #ffd695 | hsl(37, 100%, 79%) |
|
|
400 | oklch(0.880 0.109 78.42) | #ffcf82 | hsl(37, 100%, 75%) |
|
|
500 | oklch(0.864 0.123 77.71) | #ffc870 | hsl(37, 100%, 72%) |
|
|
600 | oklch(0.814 0.159 73.48) | #ffb031 | hsl(37, 100%, 60%) |
|
|
700 | oklch(0.746 0.165 66.51) | #f19400 | hsl(37, 100%, 47%) |
|
|
800 | oklch(0.595 0.131 67.70) | #b16d00 | hsl(37, 100%, 35%) |
|
|
900 | oklch(0.435 0.095 69.40) | #724600 | hsl(37, 100%, 22%) |
|
|
950 | oklch(0.259 0.055 74.44) | #331f00 | hsl(36, 100%, 10%) |
|
dsfds
50 | oklch(0.972 0.051 107.31) | #f9f9d2 | hsl(60, 76%, 90%) |
|
|
100 | oklch(0.969 0.052 107.33) | #f8f8d0 | hsl(60, 74%, 89%) |
|
|
200 | oklch(0.968 0.056 107.40) | #f8f8cd | hsl(60, 75%, 89%) |
|
|
300 | oklch(0.968 0.058 107.44) | #f8f8cb | hsl(60, 76%, 88%) |
|
|
400 | oklch(0.964 0.061 107.49) | #f7f7c8 | hsl(60, 75%, 88%) |
|
|
500 | oklch(0.964 0.063 107.53) | #f7f7c6 | hsl(60, 75%, 87%) |
|
|
600 | oklch(0.924 0.131 108.71) | #eded81 | hsl(60, 75%, 72%) |
|
|
700 | oklch(0.891 0.177 109.51) | #e4e43c | hsl(60, 76%, 56%) |
|
|
800 | oklch(0.755 0.159 109.67) | #b7b71a | hsl(60, 75%, 41%) |
|
|
900 | oklch(0.535 0.111 109.63) | #727210 | hsl(60, 75%, 25%) |
|
|
950 | oklch(0.288 0.056 109.47) | #2d2d06 | hsl(60, 76%, 10%) |
|
dsfds
50 | oklch(0.933 0.028 143.70) | #deeedd | hsl(116, 33%, 90%) |
|
|
100 | oklch(0.924 0.033 142.48) | #daecd8 | hsl(114, 34%, 89%) |
|
|
200 | oklch(0.915 0.038 142.83) | #d5ead3 | hsl(115, 35%, 87%) |
|
|
300 | oklch(0.907 0.043 141.99) | #d1e8ce | hsl(113, 36%, 86%) |
|
|
400 | oklch(0.896 0.045 143.16) | #cce5ca | hsl(116, 34%, 85%) |
|
|
500 | oklch(0.888 0.050 142.40) | #c8e3c5 | hsl(114, 35%, 83%) |
|
|
600 | oklch(0.792 0.094 142.41) | #98cb93 | hsl(115, 35%, 69%) |
|
|
700 | oklch(0.696 0.137 141.63) | #69b260 | hsl(113, 35%, 54%) |
|
|
800 | oklch(0.564 0.122 141.79) | #488741 | hsl(114, 35%, 39%) |
|
|
900 | oklch(0.408 0.084 142.01) | #2d5529 | hsl(115, 35%, 25%) |
|
|
950 | oklch(0.232 0.039 142.90) | #122211 | hsl(116, 33%, 10%) |
|
dsfds
50 | oklch(0.926 0.009 145.51) | #e3e8e3 | hsl(120, 10%, 90%) |
|
|
100 | oklch(0.887 0.013 141.81) | #d5dcd4 | hsl(113, 10%, 85%) |
|
|
200 | oklch(0.848 0.017 142.55) | #c7d0c6 | hsl(114, 10%, 80%) |
|
|
300 | oklch(0.810 0.023 141.22) | #b9c5b7 | hsl(111, 11%, 75%) |
|
|
400 | oklch(0.770 0.028 143.56) | #aab9a9 | hsl(116, 10%, 69%) |
|
|
500 | oklch(0.729 0.033 142.29) | #9cad9a | hsl(114, 10%, 64%) |
|
|
600 | oklch(0.642 0.043 142.82) | #7e947c | hsl(115, 10%, 53%) |
|
|
700 | oklch(0.549 0.043 142.66) | #637861 | hsl(115, 11%, 43%) |
|
|
800 | oklch(0.446 0.033 141.83) | #4a5948 | hsl(113, 11%, 32%) |
|
|
900 | oklch(0.339 0.023 142.60) | #313b30 | hsl(115, 10%, 21%) |
|
|
950 | oklch(0.219 0.012 145.15) | #171c17 | hsl(120, 10%, 10%) |
|
dsfds
50 | oklch(0.918 0.008 17.30) | #e9e2e2 | hsl(0, 14%, 90%) |
|
|
100 | oklch(0.835 0.016 17.47) | #d3c5c5 | hsl(0, 14%, 80%) |
|
|
200 | oklch(0.750 0.024 17.71) | #bda8a8 | hsl(0, 14%, 70%) |
|
|
300 | oklch(0.663 0.035 18.08) | #a88b8b | hsl(0, 14%, 60%) |
|
|
400 | oklch(0.574 0.046 18.58) | #926e6e | hsl(0, 14%, 50%) |
|
|
500 | oklch(0.490 0.038 18.55) | #755858 | hsl(0, 14%, 40%) |
|
|
600 | oklch(0.438 0.033 18.48) | #634b4b | hsl(0, 14%, 34%) |
|
|
700 | oklch(0.386 0.028 18.45) | #523e3e | hsl(0, 14%, 28%) |
|
|
800 | oklch(0.327 0.023 18.42) | #403030 | hsl(0, 14%, 22%) |
|
|
900 | oklch(0.270 0.018 18.35) | #2f2323 | hsl(0, 15%, 16%) |
|
|
950 | oklch(0.209 0.011 18.10) | #1d1616 | hsl(0, 14%, 10%) |
|
Related palettes
Discover more palettes with a similar mood and vibe or Browse our collection.