Don’t Use Black for Shadows

This is because shadows in real life are not black!

That is, “don’t use black for shadows over colored backgrounds.” At every step of my design education I was taught this. For example, when adding a drop shadow as a layer style in Photoshop, don’t just pick a black or a gray but sample a color from the background, then dial it back in opacity until it looks good.

This is because shadows in real life are not black. They are darkened versions of whatever they sit on top of, because there is less light. I don’t think black at any opacity level would get it just right. Now that we have the (awesome) RGBa in our CSS toolbox, I’ve been hearing and seeing people use dialed back black (e.g. rgba(0,0,0,0.5) ) for backgrounds and shadows. This is being taught and encouraged with comments like “the shadow color will pick up the background color because of the opacity“. True, it will, but it will be mixed with black, not a deeper toned version of itself.

Patrick Julicher

Patrick JulicherPatrick started developing websites at the age of 25, only using HTML and building simple websites. Through the years his passion for designing and developing grew, and his career moved in that direction in the year 2004, when he decided to try and get a job in ICT and Web Development.
He got this chance at WE ICT, based in Nijmegen, The Netherlands. For the first couple of years he combined network management for customers with creating database-driven websites in ASP. Since 2008 his main work is on the developing part.
While ASP is still his favorite language, he's slowly trying to dive into ASP.NET and discover all of the possibilities.

See All Postings From Patrick Julicher >>

Comments

Be the first to write a comment

You must me logged in to write a comment.