Cheerful Color Palette
A cheerful blend of soft whites and buttery yellows dances with elegant black accents, creating a bright, playful vibe that's both modern and inviting.
Practical uses and creative applications
The Cheerful Color Palette is a vibrant blend of soft yellows, warm neutrals, and bold accents, perfect for those looking to infuse positivity and brightness into their projects. With its primary colors of #FFFFFF (white), #FFF6CB (light yellow), #F8D914 (golden yellow), #E2DDD4 (soft beige), and #000000 (black), this palette is ideal for branding that aims to evoke happiness and energy.
Designers and creatives can leverage these uplifting tones in web design to create engaging user experiences, ensuring that visitors feel welcomed and inspired. This color palette shines in various applications, from packaging for products aimed at children or lifestyle brands to interiors that create a warm and inviting atmosphere.
The cheerful hues evoke a sense of joy and creativity, making them perfect for coffee shops, playrooms, or any space that benefits from a lively ambiance. Whether you're a graphic designer looking to brighten up a client’s project or a marketer searching for the perfect colors to communicate a fun and friendly brand image, the Cheerful Color Palette provides an excellent foundation for your creative endeavors.
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.000 89.88) | #e6e6e6 | hsl(0, 0%, 90%) |
|
|
100 | oklch(0.940 0.000 89.88) | #ebebeb | hsl(0, 0%, 92%) |
|
|
200 | oklch(0.955 0.000 89.88) | #f0f0f0 | hsl(0, 0%, 94%) |
|
|
300 | oklch(0.970 0.000 89.88) | #f5f5f5 | hsl(0, 0%, 96%) |
|
|
400 | oklch(0.985 0.000 89.88) | #fafafa | hsl(0, 0%, 98%) |
|
|
500 | oklch(1.000 0.000 89.88) | #ffffff | hsl(0, 0%, 100%) |
|
|
600 | oklch(0.861 0.000 89.88) | #d1d1d1 | hsl(0, 0%, 82%) |
|
|
700 | oklch(0.715 0.000 89.88) | #a3a3a3 | hsl(0, 0%, 64%) |
|
|
800 | oklch(0.562 0.000 89.88) | #757575 | hsl(0, 0%, 46%) |
|
|
900 | oklch(0.398 0.000 89.88) | #474747 | hsl(0, 0%, 28%) |
|
|
950 | oklch(0.218 0.000 89.88) | #1a1a1a | hsl(0, 0%, 10%) |
|
dsfds
50 | oklch(0.970 0.055 97.26) | #fff6cc | hsl(49, 100%, 90%) |
|
|
100 | oklch(0.970 0.055 97.26) | #fff6cc | hsl(49, 100%, 90%) |
|
|
200 | oklch(0.970 0.055 97.26) | #fff6cc | hsl(49, 100%, 90%) |
|
|
300 | oklch(0.969 0.056 97.50) | #fff6cb | hsl(50, 100%, 90%) |
|
|
400 | oklch(0.969 0.056 97.50) | #fff6cb | hsl(50, 100%, 90%) |
|
|
500 | oklch(0.969 0.056 97.50) | #fff6cb | hsl(50, 100%, 90%) |
|
|
600 | oklch(0.928 0.133 97.76) | #ffe87a | hsl(50, 100%, 74%) |
|
|
700 | oklch(0.894 0.176 95.91) | #ffda28 | hsl(50, 100%, 58%) |
|
|
800 | oklch(0.771 0.158 93.73) | #d6b100 | hsl(50, 100%, 42%) |
|
|
900 | oklch(0.541 0.111 94.30) | #846d00 | hsl(50, 100%, 26%) |
|
|
950 | oklch(0.286 0.059 96.51) | #332a00 | hsl(49, 100%, 10%) |
|
dsfds
50 | oklch(0.971 0.055 99.49) | #fef7cd | hsl(51, 96%, 90%) |
|
|
100 | oklch(0.950 0.093 100.65) | #fcf1a8 | hsl(52, 93%, 82%) |
|
|
200 | oklch(0.932 0.126 100.69) | #fbeb83 | hsl(52, 94%, 75%) |
|
|
300 | oklch(0.914 0.154 100.46) | #fae55e | hsl(52, 94%, 67%) |
|
|
400 | oklch(0.899 0.172 99.81) | #f9df39 | hsl(52, 94%, 60%) |
|
|
500 | oklch(0.884 0.180 98.54) | #f8d914 | hsl(52, 94%, 53%) |
|
|
600 | oklch(0.799 0.164 97.94) | #dabd06 | hsl(52, 95%, 44%) |
|
|
700 | oklch(0.683 0.140 98.35) | #b09905 | hsl(52, 94%, 35%) |
|
|
800 | oklch(0.559 0.114 98.24) | #867404 | hsl(52, 94%, 27%) |
|
|
900 | oklch(0.430 0.088 99.07) | #5c5003 | hsl(52, 94%, 19%) |
|
|
950 | oklch(0.288 0.059 99.46) | #322b01 | hsl(51, 96%, 10%) |
|
dsfds
50 | oklch(0.929 0.009 84.57) | #eae7e1 | hsl(40, 18%, 90%) |
|
|
100 | oklch(0.923 0.010 81.79) | #e9e5de | hsl(38, 20%, 89%) |
|
|
200 | oklch(0.917 0.010 81.79) | #e7e3dc | hsl(38, 19%, 88%) |
|
|
300 | oklch(0.911 0.012 84.58) | #e5e1d9 | hsl(40, 19%, 87%) |
|
|
400 | oklch(0.905 0.012 79.78) | #e4dfd7 | hsl(37, 19%, 87%) |
|
|
500 | oklch(0.899 0.013 82.40) | #e2ddd4 | hsl(39, 19%, 86%) |
|
|
600 | oklch(0.787 0.028 80.22) | #c3b8a6 | hsl(37, 19%, 71%) |
|
|
700 | oklch(0.673 0.044 81.57) | #a49478 | hsl(38, 19%, 56%) |
|
|
800 | oklch(0.541 0.042 82.80) | #7b6d53 | hsl(39, 19%, 40%) |
|
|
900 | oklch(0.391 0.028 81.86) | #4d4434 | hsl(38, 19%, 25%) |
|
|
950 | oklch(0.223 0.012 84.55) | #1e1b15 | hsl(40, 18%, 10%) |
|
dsfds
50 | oklch(0.925 0.000 89.88) | #e6e6e6 | hsl(0, 0%, 90%) |
|
|
100 | oklch(0.783 0.000 89.88) | #b8b8b8 | hsl(0, 0%, 72%) |
|
|
200 | oklch(0.633 0.000 89.88) | #8a8a8a | hsl(0, 0%, 54%) |
|
|
300 | oklch(0.475 0.000 89.88) | #5c5c5c | hsl(0, 0%, 36%) |
|
|
400 | oklch(0.301 0.000 89.88) | #2e2e2e | hsl(0, 0%, 18%) |
|
|
500 | oklch(0.000 0.000 0.00) | #000000 | hsl(0, 0%, 0%) |
|
|
600 | oklch(0.115 0.000 89.88) | #050505 | hsl(0, 0%, 2%) |
|
|
700 | oklch(0.145 0.000 89.88) | #0a0a0a | hsl(0, 0%, 4%) |
|
|
800 | oklch(0.168 0.000 89.88) | #0f0f0f | hsl(0, 0%, 6%) |
|
|
900 | oklch(0.191 0.000 89.88) | #141414 | hsl(0, 0%, 8%) |
|
|
950 | oklch(0.218 0.000 89.88) | #1a1a1a | hsl(0, 0%, 10%) |
|
Related palettes
Discover more palettes with a similar mood and vibe or Browse our collection.