I was trying to apply a bold, interesting, impacting yet professional and aesthetically pleasing effect to the headings on my site. They had to look good yet still function as readable, live text and fit in with the overall look of the site. After a bit of searching on the web for interesting effects, I found this:
I really like the look of this. It is impacting, bold and interesting yet it still retains full readability and looks very nice. It is essentially just repeating text shadows which each time move down a certain amount of pixels. Each iteration gets a touch darker and this gives the illusion of depth. The site provides some CSS text to copy and paste into your CSS document and it applies the same effect as in the text at the top of the page. I did this and applied it to my web page with a few minor tweaks:
The only changes that I made were to the opacity of the majority of the shadow layers and the colour of the last one. I changed it to a dark blue hue to blend better with the pale blue background I have and I also lowered the opacity of the shadows to make it more of a subtle falloff with less of a harsh edge on the background of my site. I thought it made it look a little cleaner brighter and smoother and overall made it blend a lot better and look like less of a gimmick. This is the final result on my site:
No comments:
Post a Comment