In this comic, you'll learn about the fundamentals of contrast, which is an important part of design. This comic touches on key areas of contrast like grayscale, tints, readability of text, along with examples and fun explanations. Enjoy this informative comic strip!
Sites Used in this comic
Other posts about contrast:
- Become a Master Designer: Rule Three: Contrast, Contrast, Contrast
- Contrast and Meaning
- 10 colour contrast checking tools to improve the accessibility of your design
- Colour Contrast Check
- How C.R.A.P is Your Site Design?
Subscribe to the Vectortuts+ RSS Feed to stay up to date with the latest vector tutorials and articles.
Related Posts
Keep reading with more great tutorials and articles!
Enjoy this Post?
We'd love your vote!
Plus Members
Source Files, Bonus Tutorials and
More for $9 a month for all TUTS+
sites in one subscription.
User Comments
( ADD YOURS )Bendsen July 9th
simply brilliant !
a really cool way to explain the different types of contrast!
Nice work, Brad !
( )woony July 9th
very friendly approach , good job!
( )alex July 9th
Nice one, BUT: “you’re job”?!????!!!? I mean coooome on, people! It’s second grade stuff!!!
( )Your job / you’re (as in you are)
Sean Hodge July 10th
We got that fixed. Thx.
( )chris July 9th
nice!
( )mment July 9th
love it! the brads rock!
( )Tim Smith July 9th
Wow! What a unique idea on how to explain this concept! I read the whole thing without even noticing it. Thanks for the post, it was really useful!
( )Will Merydith July 9th
Nice Brad. You should do more of these (design concept tutorial + cartoon strip).
( )Dana Kashubeck July 9th
Excellent tutorial. Love the way you used Hector. Two thumbs up!
( )Tyler July 9th
what a fun way of explaining contrast! easy to understand and follow!
( )Charles Williams July 9th
Love it, Brad!
( )JohnONolan July 9th
Absolutely awesome, more of these please!
( )Collin July 9th
Freakin sweet idea and great execution as well.
( )Sonali July 9th
Cool!! Interesting way to explain the things.
( )Josh Walsh July 9th
Brilliantly done, as always Brad.
( )George Coghill July 9th
Great comic Brad!
( )Ignacio July 9th
That was amazing! How you used the comic medium, you just tricked me into reading it completely, before I even realized I was actually LEARNING something. I am completely and sincerely surprised. I’ll keep an eye out for your articles!
( )Karinne July 9th
Now that’s what I call effectively getting your point across! That was great. I actually read the whole things and wanted more.
It also goes to show that imagery in a blog or article or tutorial are vital to keeping the reader well… reading
Like John said: “Absolutely awesome, more of these please!
”
( )eddy was here July 9th
great ideas on contrast
loved this!
( )Sean McArthur July 9th
Indeed, not a designer, but I still read the whole thing because of it’s format and presentation. Good job!
( )Tom July 9th
Very helpful and easy to understand, great job!
( )Brett Archibald July 9th
Nice comic strip. Pity no-one explained the difference between “your” and “you’re” to the author though…
( )me September 5th
Why don’t you do it?
( )Aaron July 9th
Great blog! Really useful.
( )henry July 9th
Awesome Brad! Very creative and very clever!
( )Ashish Bogawat July 9th
Great idea and equally great execution. More please!
( )Brent Nelson July 9th
Comic tutorial forces readers to read!
( )Russell July 9th
Great tutorial Brad!
( )Diego SA July 9th
funny! and useful!
( )Brad C July 9th
Dang, thanks for the great feedback everyone, I’ll definitely be doing more of these in the future.
@alex and @Brett Archibald, thanks for pointing out the error guys. You can’t see me, but I’m kicking myself right now and working on getting that fixed
( )ktyellow July 9th
In a single word would say excellent, good way to explain this tutorial. very good job.
( )Brentp July 9th
jeez. another Megan Fisher reference….
( )sean steezy July 9th
Yeah, awesome comic to explain contrast. It took 5mins to read, but probably like 5 hours to make. Thanks!!! hella unique
( )Conny.A July 9th
Love it, a clever and fun way of explaining things.
( )elcodigodebarras July 9th
absolutely cute and instructive; very funny way to teach…and to learn !
Thanks for this lesson.
( )Henry Bennett July 9th
Awesome and original idea! Love it, and really informative info along with it too!
Cheers!
( )Sumesh July 9th
Awesome comic, Brad. I’ve been following (and tweeting links to) your comic ever since I came across your website, which was from a stumble, I think (was a long time ago).
I hope to see more of your fun+design theory comics – they make the learning experience so much easier, and makes it hard to forget.
Check out his “XHTML, you’re hurt” comic too, designers will understand the geek-humour
( )http://www.bradcolbow.com/archive.php/?p=106
Anandarup July 9th
Nice one
( )Chukki.de July 10th
Very cool….it’s a very interesting way of explaining the role of contrast.
( )More like this….
donjuan July 10th
nice one …thx for the real cute tutstyle lol…
( )Benjamin Reid July 10th
That was awesome, more!
( )Bridget Stewart July 10th
Brad, don’t feel too bad about the spelling errors. I’ve seen a few from other top blog type people. Mistakes happen. We’re only human.
More importantly, GREAT TUT! Will your presentation for the Cleveland Web Standards Association on Tuesday be like this? Will we get to see slides of Hector and you teaching us great stuff? Please, please, please!
( )Marcel July 11th
Great job. Important content through a simple and clean message. Thank you!
( )denny July 11th
Totally like this style. Great Tips
( )Fotodepp July 13th
Wow! Awesome Tutorial. Nice Tips and nice kind of Tutorial
( )ims July 13th
thx:)
( )Danielle July 15th
very cool… congrats
( )Celwin July 16th
Brilliant comic! Used it to learn some guys at the office here some things about contrast
( )Graphire July 17th
Wow.. total exceptional way to learn and enjoy it at the same time. Hope to see more like this Brad.
( )Jarod Billingslea July 17th
Wow man this is awesome, I would like to do somethign like this
. Very helpful and well done, “very” as matter of fact!
( )Zugvogel July 18th
A fundamental topic put on stage in a sophisticated way.
( )This is the way we want to learn about Design. Thx.
Jµ July 19th
Thanks Brad… Your comics are so funny. I love the way you draw it !
I showed some of it to my girlfriend who’s more kind of books reader-writer and she couldn’t understand what I laugh so much about it & then she asked what was XHTML… I would definitively come back here by myself.
Hope you can make a comic of it.
( )grimdeath July 21st
if only all tutorials were this fun!
beautiful way to teach concepts!
( )WildWon July 24th
Fantastic! Simple, yet explains some rules that most people wouldn’t consider. Way to be! Keep up the killer work
( )Jasmin Halkić July 26th
Nice article! Very useful!
( )Curtney July 26th
Nice tutorial! Very helpful to beginners like myself. I wouldn’t sweat the small spelling mistake.
( )Enk. July 28th
Now that was Cool..
( )Very very usefully for newbies like meh
Dai Hoang July 29th
i praise your aggressive to post comic but it’s not really useful otherwise is extremely time consuming
( )Roberto August 26th
Very good information. Thanks.
( )Basit September 1st
Good !!!
( )Malak September 15th
SIMPLE, TO THE POINT, CLEAR & FUN!
Thanks, an excellent tutorial.. my first read and I’m already a huge fan!! XD
( )Russel Pea Stickers October 26th
Explanations in comics: a really cool way for an explanation, and the content is also interesting so…. thumb up on Stumble Upon!
( )Thank you
Unique Business Cards November 7th
Very fun tutorial and some very good tips too
( )Thomas November 9th
Nice one, love it
( )