Footer with newsletter and nav columns
White footer with a left brand column featuring a logo, description, and email subscribe form, plus a three-column navigation grid with category links. Bottom row shows contact email and social icon buttons. Paste into Bolt, Claude Code, Replit, or Lovable for any SaaS or marketing site footer.
About this vibe coding template
A clean, full-featured footer template with two layout zones. The top row splits into a wide brand column on the left and a three-column navigation grid on the right. The brand column carries the product logo, a one-line product description, and an inline email subscribe form with a dark button. The nav grid organizes links into three category groups — Product, Tools, and Company — each with a small bold header and four to six text links. A thin separator line divides the top from the bottom row, which shows a contact email address on the left and three social icon buttons on the right. All icons are inline SVG. The whole footer sits in a white rounded card on a neutral background so it thumbnails clearly in any gallery view.
Common questions about this template
How do I add more navigation columns?
Ask your vibe coding tool to add a new column inside the nav grid and copy the structure of an existing column. Update the column title and links to match your site structure. The three-column grid will expand or you can ask the AI to adjust the grid-template-columns value.
How do I wire up the subscribe form?
Ask Bolt, Claude Code, Replit, or Lovable to connect the email input to your newsletter provider. Tell the AI which service you use — Mailchimp, ConvertKit, Loops, or a custom API endpoint — and it will add the form action or fetch handler.
How do I change the social links?
Ask your vibe coding tool to update the href attributes on the social icon buttons and replace any icons you do not need with the ones you want. Describe which platforms you are on and the AI will swap the SVG icons and add the correct links.
Use this AI coding template for
- ·SaaS product footers that need a newsletter subscribe form alongside navigation links
- ·Marketing site footers with three-column link organization and social icons
- ·Landing page footers for AI tools and developer products