Dynamic Favicon
Your browser tab icon reacts to signals in real time. GitHub
Letters
Color
Mode
Attention pulse
Notification count
999 unread
Progress ring
0%
Status
How it works
- The favicon is an SVG rebuilt as a
data: URI every time a Datastar signal changes
- A single
data-effect reads all signals and constructs the SVG string — no canvas, no libraries
- The notification dot pulses via
data-on-interval toggling a boolean signal every 750ms
- The progress ring uses SVG
stroke-dashoffset driven by a percentage signal
- Status outlines the entire icon with a colored border
- Bookmark this page (Ctrl+D / Cmd+D) — the favicon persists in your bookmarks bar too