css gradients • click here to see the html demo • another example
The picture above is a painting of Kailey of Mermaidens! The painting is by Laura Manfre and it’s floating over a linear gradient background made with CSS. I’ve shown how to create gradients with Photoshop in my Ombre Effects post. This time, I’ll show you how to create a similar effect using a few lines of CSS. I hope you guys have fun using CSS gradients.
Review
If you’re completely new to HTML/CSS and you want to follow along, please start with my HTML/CSS Basics. And, if you’re currently a Style Member, please review Lecture #3.
Special Thanks
I want to thank Kailey and Laura for giving me permission to use Laura’s painting as part of my demo for this tutorial. The painting is beautiful and you’re both awesome — thanks, ladies!
∴ credits ∴
mozilla fix (stack overflow)
css colors (css tutorial)
lines and section dividers with css (css tutorial)
how to remove backgrounds (photoshop tutorial)
calligraphy brushes (photoshop tutorial)
penmanship and wacom tablets (photoshop tutorial)
rectangle shapes (photoshop tutorial)
watermark fonts (fab fonts)
futura medium (osx default font)
mozilla fix (stack overflow)
css colors (css tutorial)
lines and section dividers with css (css tutorial)
how to remove backgrounds (photoshop tutorial)
calligraphy brushes (photoshop tutorial)
penmanship and wacom tablets (photoshop tutorial)
rectangle shapes (photoshop tutorial)
watermark fonts (fab fonts)
futura medium (osx default font)
{ 0 comments… add one now }