Footer 7 - Footer with logo, description, social icons, link columns, and legal row

Basic

Two-row footer with a logo, description, and social icons on the left, three navigation columns on the right, and a bordered legal row beneath.

Shadcn Footer 7 block

Component Data

  • ID:footer7
  • Access:basic
  • Created:Oct 9, 2024
  • Type:block

Footer 7 block design & features

The main row splits into two sides. The left column holds a linked logo image, a short muted-color description constrained to about 70% width, and a horizontal row of social media icons. The right side presents three navigation columns in an equal-width grid, each with a semibold heading and a list of small muted links. A border-top legal row below carries copyright text and policy links in extra-small type.

Social icons render at their default size in muted foreground, switching to primary on hover. Link text uses small sizing with medium weight, and section headings sit in semibold with tight tracking. The legal row reverses the visual order on desktop, placing copyright on the left and links on the right, while on mobile the links appear above the copyright.

The two-column split between branding and navigation gives this footer a balanced, editorial quality. The description text and social icons grouped with the logo create a self-contained brand column that reads independently from the navigation grid.

On smaller screens the left and right sides stack vertically, with the brand column appearing first. The three navigation columns collapse to a single column, and the legal row stacks its elements vertically.