---
title: Using SVG favicons with Unicode
date: 2026-01-01T13:00:00Z
categories:
- coding
---
Browsers support [SVG favicons](https://caniuse.com/link-icon-svg) as [`data:` URLs](https://developer.mozilla.org/en-US/docs/Web/URI/Reference/Schemes/data).
For example, this SVG:
```html
```
... can be:
1. Compressed via [svgomg](https://svgomg.net/)
2. Converted to a `data:` URL via [svgviewer](https://www.svgviewer.dev/svg-to-data-uri)
3. Inserted into HTML like this:
```html
```
The fun part is that you can use text inside the SVG, styled as you wish:
```html
```
... or even use Unicode characters:
```html
```
That can be converted into a HTML link like this:
```html
```
The variety is endless!
What makes this powerful is that:
1. You can create entire families of favicons using typography, Unicode characters, and colors.
2. The favicons are tiny (a few hundred bytes).
3. They're easy to edit and maintain (just edit the SVG text).