Codename Rainbows - easy way to apply gradients, shadows and highlights to text
Codename Rainbows allows you to effortlessly apply gradients, shadows and highlights to text. While that has been done extensively over the years, it had always required the use of images—which is especially problematic for dynamic content or large sites where hundreds of images could be required.
Images look great, but you have to create everything by hand. Even with celeritous Photoshop skills, you’d need to spend lots of time on the tedious task of making every image.
So dragoninteractive came up with an idea—What if they had a client-side script that would swoop in and beautify the titles. All we would have to do is create the HTML code, and we would be be set. No more messing about with Photoshop.
How it Works
exactly Rainbows creates its dynamic gradients. Assuming we have a basic knowledge of Javascript and jQuery, and will describe how Rainbows achieves its effect.
The gradient is actually comprised of a series of one-pixel-high slices of text. These slices are arranged vertically. Every slice is a slightly different shade, and when the slices are positioned via CSS the result is a smooth gradient created entirely without images.
Requirement: JQuery framwork
Demo: http://labs.dragoninteractive.com/rainbows_demo.php
License: MIT License
0
510
