Kage Design logo kage
helohq.com
Helo footer component

Design analysis

A dark footer closes the page with the brand lockup and social links on the left, utility navigation and legal information on the right, and ample bottom padding.

Prompt preview
## Reference images

Study these alongside the description below: hierarchy, rhythm, spacing, colour. Build for the product you are asked about, using this design language.

- Component: https://kage-design-assets.t3.tigrisfiles.io/components/helo/c47b31ce-de8b-413b-ab53-bd3bf69ea219-1790921006-5.webp
- Full page it was cut from: https://kage-design-assets.t3.tigrisfiles.io/screenshots/helo/c47b31ce-de8b-413b-ab53-bd3bf69ea219-1790920903911-full.webp
- Component on Kage: https://kage.design/component/helo-footer

## Before you start
Ask what the user's product, brand, required legal links, and social destinations are. Then create an original footer following these structural principles.

Build a full-width dark charcoal footer around #303331 with a two-column desktop layout. Place the brand lockup and a small “let's connect” label with social icon links on the left. Place compact utility links in a row or small cluster at the upper right, followed by a muted copyright line and legal links. Use warm off-white for the main brand text and subdued gray-green #9b9f99 for secondary text.

Give the footer generous horizontal padding of about 56px and vertical padding around 42–56px. Use a 16–20px wordmark treatment, 12–14px utility labels, and clear focus/hover states. Keep the mobile version stacked with legal content below the social area and preserve sufficient contrast for accessibility.

Never: copy logos, product names, copy, illustrations, or imagery from the reference.

More components