Color is a tricky element in design, and made even more challenging when incorporating images into a layout. It can be difficult to know what colors are going to complement the image and the overall design. There’s a lot of science surrounding how to mix and match colors, but John McWade of Before & After offers some foolproof ways to pick the right colors from an image in his course Before & After: Things Every Designer Should Know.
Finding the perfect color palette for your image
1. Import your image into Adobe Photoshop or Illustrator and reduce it to large squares. This will average the colors and provide you with a clear selection to choose from. In Photoshop, a quick way to accomplish this is to use the Image > Adjustments > Posterize command, and move the slider around the 6–10 range to find the best setting.
2. Select a good sampling of the key colors across your image—from both prominent colors that appear frequently and less prominent but notable “accent” colors, representing a mix of shadows, highlights, and some midtones.
3. All of them will work because they are native to that photograph, so they go well with it. Test them out and see which of these colors best complement the image in your design concepts.
Remember, color is much more than just a visual component. Every color comes with cultural connotations, symbolism, some natural strengths and weaknesses, and, of course, an opinion from everyone. Although there will be no wrong choice with this method, you’ll need to think about the mood you’re trying to convey. In the examples above, the brown feels more earthy, the gray feels more sophisticated and modern, and the pink feels more feminine. You’ll also notice that the color you select for the facing page will make that same color in the related image pop. Look how the woman’s eyes in the gray layout stand out versus in the pink layout, where the pinks in her lips and skin are more pronounced.
Be sure to watch the video Use beautiful color in John’s course for more easy tips on using a monochromatic range, analogous, complementary, and triadic colors. This will enable you to design better and faster!
Interested in more?
Adobe, Illustrator, and Photoshop are registered trademarks of Adobe Systems Incorporated in the United States and/or other countries.