npm package · MIT · < 3 KB gzip · zero deps

favipulse

Favicons that say something: who, where, and what's happening.

Draw a deterministic generative favicon from any seed (with an optional self-drawing animation), show unread badges, a progress ring for builds and uploads, a pulse when something needs attention, and give dev, staging and prod their own unmistakable icon. Typed, ESM + CJS, SSR-safe. The maintained replacement for favico.js and tinycon.

npm i favipulse
Every seed → its own icon. Same seed, different environment → same family, different colour.

Live demo look at this tab's favicon ↑

16px32px64px
Environment
Style
Badge0

Usage

// Generated icon + badge

import { favipulse } from 'favipulse';
const fav = favipulse({ seed: 'acme', env: 'auto' });
fav.badge(3);

// Progress ring while uploading

fav.progress(0.42);   // or 42
fav.progress(null);   // done
fav.pulse();          // needs attention

# Static sets per environment

 npx favipulse generate --seed acme --out public/favicons

// Vite

import favipulse from 'favipulse/vite';
plugins: [favipulse({ seed: 'acme' })]

Compared

favipulsefavico.jstinycon
Last release20262015 (0.3.10)2017 (0.6.8)
Size (min+gz)2.9 KB3.0 KB1.5 KB
TypeScript types✔ built in✖✖
ESM + CJS✔✖ (UMD)✖ (UMD)
Works without canvas / SSR✔ SVG✖✖
Badges✔✔✔
Progress ring✔✖✖
Generated icon from a seed✔ + self-drawing✖✖
Per-environment icons✔✖✖
prefers-reduced-motion✔✖n/a
Static .ico/.png/.svg + manifest CLI✔✖✖
Drop-in compat shim✔ favipulse/compat

Migrating? See the migration guide.

Support this project

Support open-source security tools

I build free, open-source tools that help developers ship safer websites. Every coffee helps keep them maintained, documented and free for everyone.

Buy me a coffee (opens Stripe in a new tab)

Secure checkout by Stripe

Portrait of Louis Wright

About the author

Louis Wright

Cyber security researcher and software engineer based in the UK.

More tools by Louis Wright

59 tools

Sentinels security scanners & CI gates · 19