The colors you choose in your designs can give the illusion of depth, making important things seem closer to the viewer and more likely to catch the eye. This video will help you learn how to use color for attention and depth in 60 Seconds!
A Bit More Detail
Learn more about using color on Tuts+.
- 6 Beginner “Safety First” Color Guidelines for the Web
- How to Color Correct and Improve White Balance in Photoshop
- See how popular website designs use color on Envato Market
60 seconds?!
This is part of a series of quick video tutorials on Envato Tuts+. We’re aiming to introduce a range of subjects, all in 60 seconds–just enough to whet your appetite. Let us know in the comments what you thought of this video and what else you’d like to see explained in 60 seconds!
Subtitles/CC
Here you’ll find the content of the “captions.sbv” file, which we can use to add subtitles to the screencast. Turn subtitles on by clicking the Subtitles/CC button on the player–click the settings gear icon to select the language:

0:00:00.000,0:00:04.380
The colors you choose in your designs
can give the illusion of depth, making
0:00:04.380,0:00:08.490
important things seem closer to the
viewer and more likely to catch the eye.
0:00:08.490,0:00:13.780
Learn how to use color for attention and
depth in sixty seconds.
0:00:13.780,0:00:18.160
Generally speaking, something closer to the eye seems
brighter or more vivid, while something
0:00:18.160,0:00:23.630
further away seems darker or more subdued.
You can use this in your designs to
0:00:23.630,0:00:26.820
create clear points of focus so the
visitor knows where to look
0:00:26.820,0:00:31.490
right away. Start by deciding what you want
your visitors to pay most attention to
0:00:31.490,0:00:37.710
and then give that thing a nice vivid
color. Surrounding elements can still be
0:00:37.710,0:00:42.140
colorful, just make sure that they're not
as bright as your main point of focus.
0:00:42.140,0:00:48.370
Now add gradual changes in color
brightness and saturation, to add layers
0:00:48.370,0:00:53.140
of depth pushing important things forward,
while less important things get pushed
0:00:53.140,0:00:58.140
further back. That's how you can use
color to control attention and add depth in
0:00:58.140,0:00:58.890
60 seconds.