Kage Design logo kage
bilt.com
bilt.com footer component

Design analysis

The footer uses a sparse dark layout: legal and company link columns sit above a divider, while the lower row contains a wordmark area, social links, and legal metadata.

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/bilt-com/b723ca8c-1652-4a12-a0a7-d6e12612eb4d-1789146826-9.webp
- Full page it was cut from: https://kage-design-assets.t3.tigrisfiles.io/screenshots/bilt-com/b723ca8c-1652-4a12-a0a7-d6e12612eb4d-1789146766657-full.webp
- Component on Kage: https://kage.design/component/bilt-footer

## Before you start
Ask what the user's product, audience, and brand are. Build a footer that reflects their information architecture and compliance needs.

Build a dark, spacious footer with a thin divider at the top. Use two or more compact link columns for legal, company, and resource destinations, then separate them from a lower row containing the user's wordmark treatment, social links, and copyright/legal text. Keep the footer visually quiet and highly scannable.

Design language: background #020b15, divider #14222d, main text #dce5e9, link text #b0bbc2, metadata #71818c, and white or pale-blue hover states. Use 13–14px link text, 11–12px legal text, 24–40px column gaps, and 48–72px overall padding. Links need generous hit areas, visible focus rings, and responsive stacking; social icons should include accessible labels. Preserve adequate contrast and allow legal copy to wrap naturally.

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

More components