Anticode Open builder

The emoji icon check: finding emoji that stand in for icons

The emoji icon check fails a page when its visible text contains an emoji. It's aimed at a habit generated sites share: a rocket before the features heading, a lightning bolt beside "fast", a sparkle on every card. The Critic reports it in the Report tab; it doesn't stop you publishing. The fix is usually to delete the emoji and let the words, or the layout, do the job.

Updated · By the Anticode team

Why emoji make poor icons

An icon in a design is drawn to match: the same stroke, size and colour as the type beside it. An emoji is a character, and its look is decided by whoever made the visitor's emoji font, not by you. The same rocket is a glossy cartoon on an iPhone, a flatter drawing on Android and different again on Windows, and none of them will match your palette or take your action colour. They also carry names: a screen reader announces each one, so a heading that starts with a sparkle is read out with the word sparkles first. And because language models scatter them through generated copy, a row of emoji above three feature cards has become one of the quickest ways a visitor spots a site nobody designed. The emoji as icons guide looks at the wider question.

What the check matches

The Critic reads all the text in the page body, the words a visitor would see, and looks for any character that Unicode classes as pictographic. That covers the familiar emoji (faces, hands, rockets, ticks in boxes, flags) and also a number of older symbols that phones draw as emoji, such as a heavy check mark, a telephone or an envelope symbol. Three marks are deliberately allowed: ©, ® and ™, which legal lines need.

Caught
An emoji anywhere in visible text: headings, buttons, card text, reviews, the footer.
Not caught
Emoji in the page title, in alt text or other attributes, or inside images, since none of those is body text.
Not affected
Plain arrows such as →, bullets, and the ©, ® and ™ signs.

The result is pass or fail for the whole page. On a site with several pages, a failure names the page it came from, but not the line, so search the copy for the character.

Common sources of a failure

  • Copy pasted from a chat assistant, which often arrives with an emoji at the start of each point.
  • A business name or product name written with an emoji in it.
  • Customer quotes typed with a heart or a smiley at the end.
  • Opening hours or contact lines using a clock, phone or pin symbol as a label.

How to fix it

  1. Find the emoji. In the builder, edit the text in place with the visual editor, or use a change request such as "remove the emoji".
  2. Delete it, and read the line again. Most of the time the heading or label is clearer without it.
  3. If it was doing a job, give that job to the layout. A numbered step, a short bold label or a rule between items marks a list better than a picture of a rocket. Anticode's design systems already work this way: steps are numbered 01, 02, 03, and Swiss numbers its sections.
  4. For contact details, write the label in words, such as Phone, Email or Address. It's clearer to everyone, including screen-reader users.

Design-engine pages don't use icon images at all. That's a design choice: type, rules, numbers and photography carry the structure, so there's nothing to clash with the typeface.

False positives and limits

  • Quotes are text too. A genuine review with a heart in it fails the check. You can keep it and accept the cross, or quote it without the emoji; Anticode won't change a quote for you.
  • It's not a publishing block. The design gate doesn't include this check, so a page with emoji can still go live. The Critic overview lists which checks the gate enforces.
  • It can't tell intent. An emoji used once as a joke in a playful brand fails the same as a row of feature icons. Read the result as a prompt to decide, not a verdict.
  • Pages only. Model-written apps are checked by their own code gate, not by this rule.

Questions people ask

Are emoji unprofessional on a business website?

Not always, but as icons they rarely match the design, they look different on every device, and screen readers read their names aloud. Words or layout usually do the job better.

Will an emoji stop me publishing?

No. It shows as a failed check in the Report tab, but the design gate doesn't block publishing for it.

Does the copyright sign count?

No. ©, ® and ™ are allowed.

Can I use an icon set instead?

Not on design-engine pages, which don't place icon images. Use labels, numbers and rules, which the design systems already provide.