Editor
Text Colour Editor
Highlight text, pick a colour, and the selection is wrapped in the right span automatically.
Live Tool
text-color.html
Live
Preview
1How To Use
Follow these steps — no coding experience needed.
- Select some textClick and drag over the word or phrase you want coloured.
- Pick a colourUse the colour swatch to choose exactly the shade you want.
- Click Apply to SelectionThe selected text is wrapped in a coloured span.
- Copy the HTMLRepeat for more words, then copy the whole block when you're done.
2Example Output
What this code looks like once it's on a real page.
Available in green, blue and orange — each word styled individually with its own span.
3Browser Compatibility
| Browser | Support | Notes |
|---|---|---|
| Chrome | ✓ Supported | Full support |
| Firefox | ✓ Supported | Full support |
| Safari | ✓ Supported | Full support |
| Edge | ✓ Supported | Full support |
| Opera | ✓ Supported | Full support |
| Mobile browsers | ✓ Supported | Full support, iOS & Android |
Supported in every current browser — Chrome, Firefox, Safari, Edge and Opera all render this identically, on both desktop and mobile.
→Related Pages
More tools that pair naturally with this one.