CSS variables
:root {
--c-vibrant-1: #2B260E;
--c-vibrant-2: #872501;
--c-vibrant-3: #F73302;
--c-vibrant-4: #CF8D1D;
--c-vibrant-5: #466101;
--c-vibrant-6: #31B800;
--c-vibrant-7: #BFBF11;
--c-vibrant-8: #D8FABB;
}
About this palette
This 8-color vibrant palette runs from Greedy Green (#D8FABB) as its lightest tone to Coffee Grounds (#2B260E) as its darkest. It blends Coffee Grounds, Bloodline, Orangish Red, Chicken Masala, Lustrian Undergrowth, Sour Apple Rings, Oilseed Crops and Greedy Green into a single set you can drop straight into a UI. Of its 28 color pairings, 7 meet the WCAG AA contrast threshold (4.5:1) for body text — the strongest is #2B260E on #D8FABB at 13.21:1.
A versatile palette suitable for marketing pages, product hero blocks, illustrations, and accent UI states.
Color breakdown
Contrast & accessibility
7 of 28 color pairings meet the WCAG AA contrast threshold (4.5:1) for body text.