Opacity
How solid or see-through a color or image is.
Back to course
01 02 03 04 01 02 03
Add a palette to a mobile screen.
Apply colors to a mobile screen and keep repeated parts consistent.
Apply color to a screen
Words to know.
Component
A reusable design part, such as a chart or button.
Neutral color
A color such as white, gray, or near-black, often used for backgrounds and text.
Contrast
How different an item looks from its background. Text needs enough difference to be readable.
What to look for.
WHAT TO LOOK FORSee it.
See it.
Say it.
Check it.
Use these prompts as you work through this lesson.
Give each swatch a job, such as “main button” or “body text.”
For exampleLabel one swatch “background” and another “main button.”
Compare changes on the same screen so you can explain what improved.
For examplePut both versions of the same mobile screen side by side.
Inspect repeated items together to catch small accidental color differences.
For exampleCheck that every repeated menu item uses the same text color.