vibe21-web-faviconView as Markdown

vibe21-web-favicon

Creates the favicon set for the site. Source is your logo, or a monogram from the site name and the primary color.

When to use it

Use it when the site still has the default Next.js icon, or when you want to replace the current set.

Need Node.js and pnpm. If either is missing, run vibe21-system-check first.

How to run it

/vibe21-web-favicon

The agent asks one question at a time:

  • your own logo, or a monogram
  • the iOS home-screen background (transparent icons become a black square on iOS)
  • the app name, short name, and iOS title

If a favicon set already exists, it asks whether to replace it.

What happens

  • Assets land in the App Router files (app/favicon.ico, app/icon0.svg, app/icon1.png, app/apple-icon.png) and in public/ for the web-app icons.
  • app/manifest.json is written. No manual <link> tags.
  • The master image and settings stay under assets/favicon/ and .vibe21/.
  • vibe21.json records the favicon choices. vibe21.md is updated.

Then it offers vibe21-web-preview.