Academy / Graphic design basics
Lesson 3 of 6 · 5 min
Colors that work together
Quick recallTwo lines on your design have the same size and weight, and both look like headlines. What do you do?Think of your answer, then open.
Make one clearly bigger or one clearly smaller. Two things at the same level fight each other. Pick one to lead.
Two rules make color easy: the important things must be easy to see, and you use few colors.
Contrast comes first
What makes words readable is light against dark. Dark blue on white is easy. Light gray on white is not, even though the colors differ. Test your eye:
Try it: pick a text color and a background and see if the words are easy to read.
Few colors, three jobs
- Base: most of the page, often white, cream or a dark color.
- Partner: a close neighbor of the base, for blocks and some text.
- Accent: one strong color for the one thing that must stand out, like a price.
If the accent is everywhere, it stops being an accent.
Your brand in one click
No brand kit yet? Further down in Colors are ready combos. Search for "calm" or "bold".
Do it
- Press Colors at the top, then Your brand, or pick a combo.
- Click your main line and give it the accent color.
- Squint. The accent should be the first thing you see.
Quick check · 3 questions
Check what stuck
Light gray text sits on a white background. What is the main problem?
Show the answer
There is not enough difference between light and dark. Contrast between light and dark is what makes words readable.
Which plan makes a calm design?
Show the answer
A base, a partner and one accent used a little. Few colors, with one accent on the one thing that matters.
In Colors, what does Your brand do?
Show the answer
Puts your brand colors and fonts on the whole design. It works on any design, also one you made before.
In this course
- 1What your design must sayEvery design has one job. How to name it before you open the editor, and how the Goal filter finds a template for it. · 4 min
- 2What people see firstHierarchy is a clear order of big, medium and small. Test it with a blur, then set it in Design. · 5 min
- 3Colors that work togetherContrast comes first, then few colors. Test your eye on eight pairs, then put your brand colors on a design in one click. · 5 min
- 4Fonts and how to pair themTwo fonts are enough. Judge six pairs with your own headline, then set yours in Design. · 5 min
- 5Space and alignmentEmpty space is part of the design, things that belong together stay close, and one clean edge makes a post look planned. · 5 min
- 6Pictures that earn their placeChoose a photo that supports the job, crop it so the right part shows, and give several photos one look. · 5 min