WordCamp 2020 presenter James Grumish covered the importance of color palettes in design.
Long-time web developer James Grumish gave an insightful slideshow at WordCamp 2020 about the importance of color palettes in design, along with an innovative way to implement your color palette in a custom WordPress theme.
Before diving into the code, there were a few key takeaways to consider:
- Palettes: what is the problem we’re trying to solve for?
- Palette systems [in WordPress themes] are (generally) rigid and/or opinionated
- The goal: Build a palette system that is “Comprehensively Integrated & Intent Focused”
We then proceeded to walk through some code (yay!) that adds color palette options within a custom theme. These options can be edited easily by content managers, and the color choices are then made available for selection in the page editor — including the classic editor, block editor. With some additional coding, it can also be made available in other popular visual editors such as WPBakery Page Builder, Elementor, Divi and Beaver Builder.
If you find yourself in need of a palette, here are a few tools that you may find useful:
- Palette builder for Bootstrap
- Contrast Checker
- Colorsafe (background color accessibility checker)
If you’re interested in learning more from WordCamp 2020, check out these recaps:
