Better Looking CSS Headings
![](https://secure.gravatar.com/avatar/cefb7f6619c2c6829915f930db6b440f?s=25&d=https%3A%2F%2Fwww.gravatar.com%2Favatar%2Fcefb7f6619c2c6829915f930db6b440f%3Fs%3D25&r=g)
Written by Saran on
November 19, 2011,
Updated
February 8, 2013Browsers now support CSS shadow, we can easily achieve better looking headings. Here's few examples of css styled headings :
Heading 1
[cc lang="css"] h1{ color: #408080; text-shadow: 0 1px 0 #FCF9EE, 0 2px 0 rgba(0, 0, 0, 0.15); } [/cc] Heading 2
[cc lang="css"] h1{ background: #6b6b6b; text-shadow: 0px 2px 3px #555; } [/cc] Heading 3
[cc lang="css"] h1{color: #ffe962; text-shadow: -1px -1px 1px #FFFFFF, 1px 1px 1px #000000; } [/cc]