General
Customization

Favicons & Icons

Learn how to generate and integrate favicons and app icons for your project.

Generating a favicon

  1. Visit Favicon Generator.
  2. Upload an image (recommended size: at least 512×512px for optimal resizing).
  3. Click on Create Favicon

Downloading

Click Download to save the generated files.

Copying and overwriting

  1. Select all downloaded files, excluding browserconfig.xml and manifest.json.
  2. Copy and paste the files into the public directory.

Updating metadata

Update the favicon references in app/layout.tsx:

app/layout.tsx
export const metadata = {
  icons: {
    icon: '/favicon.ico',
    apple: '/apple-touch-icon.png'
  }
  // ...
};