Rainbow Text Generator 🌈
This rainbow text generator spreads a colour gradient across your text and hands you the formats that can actually carry it: HTML for web pages and email, BBCode for forums, an ANSI block for Discord, a CSS gradient for your own stylesheet, and a PNG you can post anywhere. Pick a palette, type, and copy the version your destination understands.
What a rainbow text generator can and cannot copy
This is the part most tools gloss over. Colour lives in formatting, not in the letters, so there is no such thing as a coloured character you can paste into a plain field like an Instagram bio. What you can do is give each destination the markup it understands — or a picture. Here is where each output belongs.
| Output | Works in | Does not work in |
|---|---|---|
| HTML | Web pages, email signatures, Notion, Confluence, WordPress code view, Tumblr | Plain-text fields, social bios |
| BBCode | phpBB, MyBB, XenForo, vBulletin, game and modding forums | Anywhere that is not a BBCode forum |
| Discord ansi | Discord messages, inside a fenced ansi code block | Discord nicknames, status and channel names |
| CSS gradient | Any site whose stylesheet you control | Places where you cannot add CSS |
| PNG image | Instagram, TikTok, slides, thumbnails, anywhere at all | Anywhere the text must stay selectable |
How to use the rainbow text generator
- Type your text in the box above — the preview recolours as you type.
- Choose a palette and direction. Rainbow is the full spectrum; sunset, ice and toxic are calmer three- and four-colour ramps. Reverse flips the gradient.
- Copy the format your destination understands using the table above, or hit Download PNG.
- Paste into the right editor. For HTML, use the code view rather than the visual editor, or the tags will show up as text.
Where colourful text works
Discord servers
Rules, announcements and role descriptions all support the ansi block. Combine it with small text for subtitles.
See the Discord guide →Email & newsletters
The HTML output drops straight into an email signature or a newsletter template.
Thumbnails & stories
Download the PNG with a transparent background and drop it over a photo or a video.
Your own site
The CSS gradient keeps the text selectable and searchable, unlike an image.
Rainbow text generator FAQ
Why can't I copy rainbow text as plain text?
Because colour is not part of a character. Unicode encodes which letter something is, never what colour it is — that is decided by whatever is displaying it. Any site promising copy-paste “rainbow Unicode” is really giving you coloured emoji or an image. This rainbow text generator is honest about it and gives you the four things that genuinely carry colour: HTML, BBCode, a Discord ansi block, and a PNG.
How do I get rainbow text in Discord?
Copy the ansi code block output and paste it straight into a message. Discord renders ANSI escape codes inside a fenced ```ansi block, which is the only colour it supports. The palette is limited to eight colours, so the gradient is approximated — it still reads clearly as a rainbow. Note that the mobile app renders ansi blocks in some versions and not others.
Where does the HTML output work?
Anywhere that accepts HTML: a web page, an email signature, a Notion or Confluence page pasted as rich text, a WordPress post in code view, a Tumblr theme, or a forum that allows HTML. Paste it into the HTML or code view, not the visual editor, otherwise the editor escapes the tags and you see the markup instead of the colours.
What is the BBCode output for?
Older forum software — phpBB, MyBB, vBulletin, XenForo and plenty of game and modding communities — uses BBCode rather than HTML. The [color=#ff0000] tags in that output are what those forums expect.
How do I use the CSS gradient version?
It is one declaration that paints a gradient across the whole phrase instead of colouring each letter separately, which looks smoother for headings. It relies on background-clip with transparent text, and is supported in every current browser. Use it when you control the stylesheet.
Can I download the rainbow text as an image?
Yes — the Download PNG button renders exactly what you see onto a transparent canvas and saves it. A PNG is the right answer for Instagram, TikTok or anywhere that will never accept markup. The image is drawn in your browser with the Canvas API; nothing is uploaded.
Is the rainbow text generator free?
Yes. Every output and the PNG download are free, there is no account, and the text never leaves your device.