Brand Name

• next-seo.config.json

Brand Color

• tailiwind.config.js

Make Logo

• Use spark.adobe.com/express-apps/logomaker/preview
• Crop excess space around logo iloveimg.com/crop-image
• Color the png
• Remove background + resize to 500 x 500 remove.bg/upload save as logo.png

Logo to SVG

• Use https://image.online-convert.com/convert-to-svg

Favicon

• upload a square png image (260x260) to realfavicongenerator.net
• update files in public/favicons

Logo SVG

• npx @svgr/cli --icon public/logo.svg
• copy and override the one in components/Logo.jsx

Typography classes

• globalStyles.jsx

Cors

• next.config.js
• cors scripting and proxy (to connect with external backend)
• More on Cors *Security Headers* Next.js Cors header

recommended layout structure

• <Container>
• main
• -- section
• -- section
• main
• <Container/>

• og-image.vercel.app
• SQL design - drawsql.app
• tailwindui.com
• wickedblocks.dev
• build-a-full-api-with-next-js
• https://dev.to/hunterbecton/middleware-in-next-js-moving-from-express-1bmf
• next-express
• Blur 1 for Image Component
• Blur 2 for Image Component
• Icons8 Free High Quality Illustrations