So many color choices, so little time! What does a designer and coder do to narrow down the potential number of colors to use in a design or interface? They use color palettes and color palette generators!
If you’re not quite sure about how colors play with and off of each other, take a look at this article (and its predecessors in the series) to understand a bit more about color theory in design.
Once you have a solid grasp of the lingo and theory behind color design, it’s time to work with palette generators to get started! This is a great palette generator where you paste the URL of your layout image (or any image, really), hit “Color-Palette-ify!“, and are presented with two lovely color palettes directly curated from your provided image (the left palette is more “muted” colors and the right palette is more “saturated” colors). Adobe Color also provides an amazing tool for creating palettes based on one main color hex code you provide – you can toggle in between color harmony rules, adjust which color you’d like to use as a baseline, and save color palettes in a few simple clicks.
Just opening your image in an editing program, picking out colors with the eyedropper, and creating color swatches is a more advanced and often simpler way to work with color and develop your eye for color harmony. There are lots of interesting color combinations you’d never think to try until you do!