---
title: Using an Emoji as a Favicon
description: You can use an emoji as a favicon with a one-line inline SVG: handy for a quick placeholder. Why it renders differently per OS, and when to export a real file.
canonical: https://favicontools.com/glossary/emoji-favicon
---

# Using an Emoji as a Favicon

You can set an emoji as a favicon by pointing the icon link at an inline SVG data URI that holds the emoji as text, with no image file at all. It works in modern browsers instantly. It's a great placeholder, but the emoji is drawn by the operating system's own font, so it looks different across Windows, macOS, Android and iOS, and it won't satisfy /favicon.ico or home-screen icons. For anything past a quick start, export a real set.

## One line, no file

The trick is an inline SVG data URI: the link's href is an SVG that draws the emoji as a text element, so there's no separate image to host. Modern browsers render it in the tab immediately, which makes it a perfect placeholder while you build.

The emoji itself is drawn by whatever emoji font the viewer's operating system ships, so the same favicon looks subtly (or not so subtly) different on each platform.

## The one-liner

```html
<link
  rel="icon"
  href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'><text y='.9em' font-size='90'>🦊</text></svg>"
/>
```

Swap in any emoji. In production, URL-encode the special characters: some browsers are fussy about raw angle brackets in a data URI.

> **Tab only, and it varies per device:** An emoji favicon covers the browser tab, not /favicon.ico or home-screen icons, and its look depends on the OS emoji font. Treat it as a placeholder; export a real icon set for anything you ship.

## Emoji favicon FAQ

### Can I use an emoji as a favicon?

Yes, via an inline SVG data URI that renders the emoji as text. It works in modern browsers with no image file, which makes it a handy quick placeholder.

### Why does my emoji favicon look different on each device?

Because the emoji is drawn with the operating system's own emoji font. Apple, Google, and Microsoft each draw the same emoji differently, so your favicon inherits that variation.

### Is an emoji favicon good enough for production?

As the only icon, no. It doesn't cover /favicon.ico or home screens, and it looks inconsistent across platforms. Use it to start, then export a proper set for launch.