Super User is a question and answer site for computer enthusiasts and power users. It's 100% free, no registration required.

Sign up
Here's how it works:
  1. Anybody can ask a question
  2. Anybody can answer
  3. The best answers are voted up and rise to the top

How to display gradient fill text without using image in html.

share|improve this question
Also DocType specializes in HTML and web design problems, the link is also at the bottom of any page. – GAThrawn Sep 10 '09 at 10:44
This is possibly a doctype question. If at most. What makes it programming related? The author is looking for a tool to display gradient fill text without using an image in HTML. – BinaryMisfit Sep 10 '09 at 10:53

You should use SVG, Scalable Vector Graphics for that.

share|improve this answer
...and RaphaelJS for the crappy IE. +1 – Boldewyn Sep 10 '09 at 13:07

There are many online tools that create gradient text. Of course, each letter has 1 single color.

For instance, you could use this tool: Gradient Text Generator. It generates BBCode and HTML code.

A Google search will find plenty of others, including several that can creates gradients between more than 2 colors.

share|improve this answer
Thanks for your answer. But I want to display more than one color for each letter in html(Linear Gradient). – user10657 Sep 10 '09 at 10:59
Then it's not possible without using an image, or a Flash (or Silverlight) object. – Snark Sep 10 '09 at 11:37
I need the text as contenteditable. So by using an image its not possible. Any other way without using an image, or a Flash object. – user10657 Sep 10 '09 at 11:53

Your Answer


By posting your answer, you agree to the privacy policy and terms of service.