Setup
1. Add your own logo in the /app folder and name it icon.png.
Not using .png extension? Update components that use icon.png like the Header
2. Create your site favicon with this free Favicon Generator . Download the zip file and put this 2 files in the /app folder
  • apple-touch-icon.png (rename it apple-icon.png)
  • favicon.ico
NextJS will automatically reference them in the <head /> of your HTML page. Read more about metadata file convention.
Create a rectangle logo with your name like the one below. Name it logoAndName.png and add it to the /public folder.
icon
ShipFastCheap
Create two 1200x660 images for social media sharing. 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 ressources
1.If you need a logo, you can use LogoFast
2.If you need SVG illustrations, you can use Undraw
3.If you need SVG background patterns, you can use HeroPatterns
4.f you need icons, you can use Heroicons
5.If you need SVG blobs, you can use Haikei
6.If you need Tailwind Snippets , you can use
7.If you need Notion-like icons, you can use Snippets
8.Use Overflow
1.If you need cute SVG doodles, you can use Figma Doodles