Colored characters in HTML title
css, html
Solution
Unicode. Icon symbols AKA: Pictographs ☕, Emojis .
Symbol HEX code Description
✍ `✍` Pictograph
✍︎ `✍︎` Pictographs as Standardized Variant
To use them in your Title:
<title>Hearts 💙💚💛</title>
Hearts
Don't forget that if you have some transportation website and you used this character ⛟ `⛟` for your "⛟ Order now!" button - watch out! Tomorrow it could shine in the competitor's colors — so use the standardized variant: ⛟︎ `⛟︎` - or rather a custom SVG or Font-icon that matches the brand needs.
PS: Don't use `transform: rotate(Ndeg);` ☜ ☝ ☞ ☟ it's just matter of time ;)
- Unicode.org - Emoji
- Unicode.org - Emoji - Reports tr51
- Standardized Variants
- Unicode Standards (7.0.0)
- the-absolute-minimum-must-know-about-unicode-and-character-sets
- Unicode characters generator
- How to prevent Unicode characters from rendering as emoji in HTML from JavaScript?
Problem
Using Firefox I stumbled upon a page with differently colored characters in the title. How to insert colored characters into a HTML `<title>` tag? What is this standard called? Update: Apparently it has something to do with the (UTF?) heart emojis characters. Here is the screenshot: Instructions on how to insert those can be found here. I made a test Facebook post and it really renders hearts of different colors in Firefox title.