Figma Footer

Preview

Figma Footer

Figma Footer Blocks

Footer blocks are placed at the bottom of a webpage. Footers contain information about your brand or project and structured links to key pages.

Footer Anatomy

Set	Variants	Properties
Footer	3	Size Desktop, Tablet, Mobile

The Footer block is one set of three variants — Desktop and Tablet at 121px and Mobile at 159px — a brand column with structured link groups and legal line that closes every Website Builder page.

Footer AI Prompt

Paste this into Claude, ChatGPT, or Figma Make:

Build a website footer block in Figma in Desktop, Tablet and Mobile sizes. Top row: the brand logo and a one-line tagline on the left, then four link columns — Product, Company, Resources, Legal — each a bold heading over four to five muted links. A newsletter column on the far right with a heading, an email input and a Subscribe button. Bottom row: a divider, then a copyright line on the left, language and currency selects in the middle, and a row of round social icon buttons on the right. Desktop and Tablet keep the row at roughly 121px per band; Mobile stacks the link columns as collapsible accordion groups, moves the newsletter above them and grows to about 159px per band. Build the link as a nested text component with a hover underline, the social buttons as icon instances, and bind every fill and stroke to variables so the footer flips between light, dark and brand-coloured backgrounds without edits.

You can use footers as valuable building blocks and information resources for your website or application visitors while also following your business goals.