Skip to content

Getting Started

Louis Wright edited this page Oct 14, 2026 · 1 revision

Getting Started

Install

npm i favipulse

No bundler? <script src="https://unpkg.com/favipulse"></script> exposes window.favipulse.

1. A generated favicon

import { favipulse } from 'favipulse';
const fav = favipulse({ seed: 'acme' });

favipulse finds your <link rel="icon"> (or creates one) and points it at an SVG data URI. The same seed always produces the same icon, in every browser and in Node.

2. Make it draw itself

await fav.draw(1200); // ms; instant when the user prefers reduced motion

3. Show something

fav.badge(5);        // unread count
fav.progress(0.6);   // progress ring
fav.pulse();         // attention halo
fav.reset();         // back to plain

4. Tell environments apart

favipulse({ seed: 'acme', env: 'auto' }); // localhost → dev, staging.* → staging, else prod

5. Ship static files too

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

Then paste public/favicons/prod/head.html into your <head> (or use the Vite plugin / Next.js helper).

TypeScript

Types ship in the package. import type { Favipulse, FavipulseOptions } from 'favipulse'.

CommonJS

const { favipulse } = require('favipulse');

Clone this wiki locally