Serene Color Palette
A serene blend of soft grays and soothing blues meets bold crimson accents, evoking a stylish yet moody atmosphere of calm with dramatic flair.
Practical uses and creative applications
The Serene Color Palette features a harmonious blend of soothing hues, including soft grays (#c9d1d3) and whites (#f7f7f7), complemented by tranquil blues (#9dd3df) and deep accents of charcoal (#3b3737) and rich burgundy (#991818). This versatile palette is ideal for brands and creatives looking to evoke a sense of calmness and sophistication.
Whether you're designing a website, creating packaging, or curating interiors, the serene tones work beautifully to foster a tranquil environment that resonates with audiences seeking peace and balance. Perfect for wellness brands, lifestyle blogs, and modern interior designs, the Serene Color Palette appeals to designers who prioritize a minimalist yet impactful aesthetic.
Its subtle yet striking combination of colors can enhance user experience in web design, making interactions feel more inviting and less overwhelming. Additionally, this palette is well-suited for packaging that aims to convey quality and elegance, appealing to consumers who appreciate thoughtful design.
Use this palette to create spaces and branding that reflect serenity and nurture creativity.
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.925 0.005 214.33) | #e3e7e8 | hsl(192, 10%, 90%) |
|
|
100 | oklch(0.912 0.006 211.04) | #dee3e4 | hsl(190, 10%, 88%) |
|
|
200 | oklch(0.897 0.006 223.46) | #d9dee0 | hsl(197, 10%, 86%) |
|
|
300 | oklch(0.883 0.008 207.14) | #d3dadb | hsl(188, 10%, 84%) |
|
|
400 | oklch(0.868 0.008 216.63) | #ced5d7 | hsl(193, 10%, 83%) |
|
|
500 | oklch(0.855 0.009 214.35) | #c9d1d3 | hsl(192, 10%, 81%) |
|
|
600 | oklch(0.744 0.017 216.71) | #a1afb3 | hsl(193, 11%, 67%) |
|
|
700 | oklch(0.629 0.024 214.50) | #798d92 | hsl(192, 10%, 52%) |
|
|
800 | oklch(0.505 0.020 214.51) | #58686c | hsl(192, 10%, 38%) |
|
|
900 | oklch(0.367 0.014 217.77) | #374144 | hsl(194, 11%, 24%) |
|
|
950 | oklch(0.218 0.006 214.43) | #171b1c | hsl(192, 10%, 10%) |
|
dsfds
50 | oklch(0.925 0.000 89.88) | #e6e6e6 | hsl(0, 0%, 90%) |
|
|
100 | oklch(0.934 0.000 89.88) | #e9e9e9 | hsl(0, 0%, 91%) |
|
|
200 | oklch(0.946 0.000 89.88) | #ededed | hsl(0, 0%, 93%) |
|
|
300 | oklch(0.955 0.000 89.88) | #f0f0f0 | hsl(0, 0%, 94%) |
|
|
400 | oklch(0.967 0.000 89.88) | #f4f4f4 | hsl(0, 0%, 96%) |
|
|
500 | oklch(0.976 0.000 89.88) | #f7f7f7 | hsl(0, 0%, 97%) |
|
|
600 | oklch(0.842 0.000 89.88) | #cbcbcb | hsl(0, 0%, 80%) |
|
|
700 | oklch(0.699 0.000 89.88) | #9e9e9e | hsl(0, 0%, 62%) |
|
|
800 | oklch(0.552 0.000 89.88) | #727272 | hsl(0, 0%, 45%) |
|
|
900 | oklch(0.394 0.000 89.88) | #464646 | hsl(0, 0%, 27%) |
|
|
950 | oklch(0.218 0.000 89.88) | #1a1a1a | hsl(0, 0%, 10%) |
|
dsfds
50 | oklch(0.935 0.023 210.40) | #d9eef2 | hsl(190, 49%, 90%) |
|
|
100 | oklch(0.913 0.030 215.07) | #cde8ef | hsl(192, 52%, 87%) |
|
|
200 | oklch(0.894 0.037 213.53) | #c1e3eb | hsl(191, 51%, 84%) |
|
|
300 | oklch(0.874 0.045 212.52) | #b5dee7 | hsl(191, 51%, 81%) |
|
|
400 | oklch(0.853 0.051 213.61) | #a9d8e3 | hsl(191, 51%, 78%) |
|
|
500 | oklch(0.834 0.058 212.89) | #9dd3df | hsl(191, 51%, 75%) |
|
|
600 | oklch(0.753 0.084 213.51) | #6bbdcf | hsl(191, 51%, 62%) |
|
|
700 | oklch(0.669 0.099 215.41) | #3da4bb | hsl(191, 51%, 49%) |
|
|
800 | oklch(0.537 0.078 215.26) | #2d798a | hsl(191, 51%, 36%) |
|
|
900 | oklch(0.392 0.054 215.33) | #1d4d58 | hsl(191, 50%, 23%) |
|
|
950 | oklch(0.237 0.028 211.46) | #0d2226 | hsl(190, 49%, 10%) |
|
dsfds
50 | oklch(0.923 0.001 17.18) | #e6e5e5 | hsl(0, 2%, 90%) |
|
|
100 | oklch(0.814 0.004 17.25) | #c5c1c1 | hsl(0, 3%, 76%) |
|
|
200 | oklch(0.702 0.008 17.35) | #a49d9d | hsl(0, 4%, 63%) |
|
|
300 | oklch(0.587 0.010 17.44) | #827a7a | hsl(0, 3%, 49%) |
|
|
400 | oklch(0.467 0.009 17.48) | #5f5858 | hsl(0, 4%, 36%) |
|
|
500 | oklch(0.341 0.006 17.43) | #3b3737 | hsl(0, 4%, 22%) |
|
|
600 | oklch(0.316 0.004 17.38) | #343131 | hsl(0, 3%, 20%) |
|
|
700 | oklch(0.292 0.004 17.41) | #2e2b2b | hsl(0, 3%, 17%) |
|
|
800 | oklch(0.267 0.003 17.34) | #272525 | hsl(0, 3%, 15%) |
|
|
900 | oklch(0.242 0.003 17.37) | #211f1f | hsl(0, 3%, 13%) |
|
|
950 | oklch(0.215 0.002 17.28) | #1a1919 | hsl(0, 2%, 10%) |
|
dsfds
50 | oklch(0.898 0.042 17.95) | #f8d3d3 | hsl(0, 73%, 90%) |
|
|
100 | oklch(0.788 0.093 19.36) | #f0a2a2 | hsl(0, 72%, 79%) |
|
|
200 | oklch(0.690 0.149 21.72) | #e97171 | hsl(0, 73%, 68%) |
|
|
300 | oklch(0.610 0.197 25.20) | #e14141 | hsl(0, 73%, 57%) |
|
|
400 | oklch(0.540 0.203 27.49) | #ca2020 | hsl(0, 73%, 46%) |
|
|
500 | oklch(0.441 0.164 27.23) | #991818 | hsl(0, 73%, 35%) |
|
|
600 | oklch(0.396 0.145 26.98) | #831515 | hsl(0, 72%, 30%) |
|
|
700 | oklch(0.348 0.126 26.78) | #6d1111 | hsl(0, 73%, 25%) |
|
|
800 | oklch(0.302 0.106 26.34) | #580e0e | hsl(0, 73%, 20%) |
|
|
900 | oklch(0.251 0.085 25.82) | #420a0a | hsl(0, 74%, 15%) |
|
|
950 | oklch(0.199 0.061 24.66) | #2c0707 | hsl(0, 73%, 10%) |
|
Related palettes
Discover more palettes with a similar mood and vibe or Browse our collection.