Extras

Setup

1. Add your own logo: Place your logo in the /app folder and name it icon.png.

2. Create site favicon: Use the Favicon Generator, download the zip file, and add these 2 files to the /app folder:

   • apple-touch-icon.png (rename it to apple-icon.png)
   • favicon.ico

   NextJS will automatically reference them in the head of your HTML page. Read more about metadata file convention.

3. Create a rectangle logo with your name: Name it logoAndName.png and add it to the /public folder. Next-Auth will automatically add it to your login pages (see /libs/next-auth.js file).

   

4. Create social media sharing images: Design two 1200x660 images, name the first opengraph-image.png and the second twitter-image.png, and add them to the /app folder.

   NextJS will automatically reference them in the head of your HTML page. Read more about metadata file convention.

Useful Resources

• If you need a logo, you can use LogoFast.
• If you need SVG illustrations, you can use Undraw.
• If you need SVG background patterns, you can use Hero Patterns.
• If you need icons, you can use Heroicons & Lucide.
• If you need SVG blobs, you can use Haikei.
• If you need Tailwind Snippets, you can use Snippets.
• If you need Notion-like icons, you can use Overflow.
• If you need cute SVG doodles, you can use Figma Doodles.