public.com
Design analysis
The footer transitions to white, exposes multiple link columns and contact/app information, then continues into a pale legal disclosure area with dense regulatory text.
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/public-com/cb41c975-325f-4844-b439-84e9d28bd7b7-1789146538-10.webp - Full page it was cut from: https://kage-design-assets.t3.tigrisfiles.io/screenshots/public-com/cb41c975-325f-4844-b439-84e9d28bd7b7-1789146490836-full.webp - Component on Kage: https://kage.design/component/public-footer ## Before you start Ask what the user's product and brand are, then apply these principles to that context rather than reproducing the reference. Build a comprehensive responsive footer. Start with a white upper footer containing four or five columns: product links, resources, quick links, contact details, and a brand/app-download area. Add generous column gaps, 12–14px sans-serif links, compact headings, and subtle hover underlines. Below, add a pale blue-gray legal region (#F3F8FA) with a row of policy links, copyright, and long-form regulatory disclosures in 10–11px muted text. Use #111111 headings, #555555 body text, #DDE5E8 separators, 24–48px padding, and a clear max-width grid. Collapse columns into accordions on mobile while keeping critical disclosures readable. Never use logos, product names, copy, illustrations, or imagery from the reference.
kage