Vibrant Modern Color Palette
This vibrant palette blends moody slate gray with bold crimson and warm coral, accented by sunny golds, creating an energetic and modern vibe that feels both striking and inviting.
Practical uses and creative applications
The Vibrant Modern Color Palette is a dynamic blend of bold hues that can effortlessly elevate any creative project. Featuring deep charcoal (#4b4b55) and striking reds (#f4324a, #ff516c), paired with warm accents of orange (#fb9c5a) and yellow (#fcc755), this palette is perfect for branding, web design, and packaging that seeks to make a lasting impression.
Designers can utilize these colors to create eye-catching logos or websites that resonate with a youthful, energetic audience, while also conveying a sense of contemporary style. Ideal for brands targeting millennials and Gen Z, the Vibrant Modern Color Palette suits a variety of industries, from fashion and beauty to tech and lifestyle.
Its lively tones evoke feelings of excitement and positivity, making it an excellent choice for marketing materials and social media campaigns aimed at creative professionals. Additionally, interior designers can incorporate these colors to create modern, inviting spaces that inspire creativity and collaboration, perfect for co-working spaces, studios, or trendy cafés.
Whether you’re looking to revamp your branding or design a vibrant interior, this color palette is sure to deliver an impactful aesthetic.
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.920 0.004 286.32) | #e4e4e7 | hsl(240, 6%, 90%) |
|
|
| 100 | oklch(0.822 0.010 286.18) | #c4c4cb | hsl(240, 6%, 78%) |
|
|
| 200 | oklch(0.722 0.016 286.00) | #a4a4af | hsl(240, 6%, 66%) |
|
|
| 300 | oklch(0.621 0.021 285.78) | #858593 | hsl(240, 6%, 55%) |
|
|
| 400 | oklch(0.519 0.022 285.61) | #676775 | hsl(240, 6%, 43%) |
|
|
| 500 | oklch(0.417 0.016 285.66) | #4b4b55 | hsl(240, 6%, 31%) |
|
|
| 600 | oklch(0.378 0.014 285.74) | #414149 | hsl(240, 6%, 27%) |
|
|
| 700 | oklch(0.340 0.012 285.73) | #37373e | hsl(240, 6%, 23%) |
|
|
| 800 | oklch(0.296 0.011 285.72) | #2c2c32 | hsl(240, 6%, 18%) |
|
|
| 900 | oklch(0.254 0.009 285.72) | #222227 | hsl(240, 7%, 14%) |
|
|
| 950 | oklch(0.210 0.006 285.89) | #18181b | hsl(240, 6%, 10%) |
|
dsfds
| 50 | oklch(0.895 0.051 10.63) | #fccfd4 | hsl(353, 88%, 90%) |
|
|
| 100 | oklch(0.829 0.090 10.52) | #fbafb9 | hsl(352, 90%, 84%) |
|
|
| 200 | oklch(0.768 0.127 12.57) | #f9909d | hsl(353, 90%, 77%) |
|
|
| 300 | oklch(0.713 0.164 14.88) | #f77181 | hsl(353, 89%, 71%) |
|
|
| 400 | oklch(0.667 0.200 17.21) | #f65166 | hsl(352, 90%, 64%) |
|
|
| 500 | oklch(0.632 0.226 20.82) | #f4324a | hsl(353, 90%, 58%) |
|
|
| 600 | oklch(0.591 0.236 25.20) | #e90c28 | hsl(352, 90%, 48%) |
|
|
| 700 | oklch(0.502 0.199 24.87) | #bb0a20 | hsl(353, 90%, 39%) |
|
|
| 800 | oklch(0.409 0.161 24.34) | #8d0818 | hsl(353, 89%, 29%) |
|
|
| 900 | oklch(0.310 0.120 23.05) | #5f0510 | hsl(353, 90%, 20%) |
|
|
| 950 | oklch(0.201 0.073 19.50) | #300308 | hsl(353, 88%, 10%) |
|
dsfds
| 50 | oklch(0.892 0.059 7.77) | #ffccd4 | hsl(351, 100%, 90%) |
|
|
| 100 | oklch(0.842 0.090 8.75) | #ffb3bf | hsl(351, 100%, 85%) |
|
|
| 200 | oklch(0.796 0.120 10.47) | #ff9baa | hsl(351, 100%, 80%) |
|
|
| 300 | oklch(0.752 0.152 11.37) | #ff8296 | hsl(350, 100%, 75%) |
|
|
| 400 | oklch(0.715 0.182 13.55) | #ff6a81 | hsl(351, 100%, 71%) |
|
|
| 500 | oklch(0.682 0.209 15.83) | #ff516c | hsl(351, 100%, 66%) |
|
|
| 600 | oklch(0.637 0.249 22.65) | #ff183c | hsl(351, 100%, 55%) |
|
|
| 700 | oklch(0.567 0.230 25.43) | #de0022 | hsl(351, 100%, 44%) |
|
|
| 800 | oklch(0.455 0.184 24.52) | #a5001a | hsl(351, 100%, 32%) |
|
|
| 900 | oklch(0.335 0.135 22.95) | #6c0011 | hsl(351, 100%, 21%) |
|
|
| 950 | oklch(0.204 0.082 17.74) | #330008 | hsl(351, 100%, 10%) |
|
dsfds
| 50 | oklch(0.928 0.042 56.75) | #fee1cd | hsl(24, 96%, 90%) |
|
|
| 100 | oklch(0.895 0.061 56.44) | #fdd3b6 | hsl(25, 95%, 85%) |
|
|
| 200 | oklch(0.864 0.082 55.54) | #fdc59f | hsl(24, 96%, 81%) |
|
|
| 300 | oklch(0.835 0.101 56.07) | #fcb888 | hsl(25, 95%, 76%) |
|
|
| 400 | oklch(0.806 0.121 54.91) | #fcaa71 | hsl(25, 96%, 72%) |
|
|
| 500 | oklch(0.777 0.140 53.87) | #fb9c5a | hsl(25, 95%, 67%) |
|
|
| 600 | oklch(0.717 0.181 49.07) | #fa7a21 | hsl(25, 96%, 55%) |
|
|
| 700 | oklch(0.631 0.177 45.41) | #dc5d05 | hsl(25, 96%, 44%) |
|
|
| 800 | oklch(0.508 0.140 46.31) | #a34504 | hsl(25, 95%, 33%) |
|
|
| 900 | oklch(0.376 0.100 48.08) | #6a2d03 | hsl(24, 94%, 21%) |
|
|
| 950 | oklch(0.235 0.057 53.76) | #321501 | hsl(24, 96%, 10%) |
|
dsfds
| 50 | oklch(0.953 0.046 85.19) | #feeecd | hsl(40, 96%, 90%) |
|
|
| 100 | oklch(0.935 0.069 86.15) | #fee7b5 | hsl(41, 97%, 85%) |
|
|
| 200 | oklch(0.914 0.090 86.19) | #fddf9d | hsl(41, 96%, 80%) |
|
|
| 300 | oklch(0.894 0.109 85.40) | #fdd785 | hsl(41, 97%, 76%) |
|
|
| 400 | oklch(0.874 0.127 84.95) | #fccf6d | hsl(41, 96%, 71%) |
|
|
| 500 | oklch(0.856 0.142 83.67) | #fcc755 | hsl(41, 97%, 66%) |
|
|
| 600 | oklch(0.816 0.164 78.93) | #fbb41d | hsl(41, 97%, 55%) |
|
|
| 700 | oklch(0.725 0.151 76.49) | #db9704 | hsl(41, 96%, 44%) |
|
|
| 800 | oklch(0.583 0.121 76.94) | #a37003 | hsl(41, 96%, 33%) |
|
|
| 900 | oklch(0.431 0.089 78.64) | #6a4902 | hsl(41, 96%, 21%) |
|
|
| 950 | oklch(0.265 0.053 81.74) | #322201 | hsl(40, 96%, 10%) |
|
Related palettes
Discover more palettes with a similar mood and vibe or Browse our collection.
