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

Design analysis

A very dark footer closes the page with a product-family block, several dense link columns, app download controls, social links, and legal disclosures. Strong hierarchy keeps the unusually large information volume navigable.

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/rocketmoney-com/33d2822e-a753-4b7c-bf3f-3f514d417ce5-1789146591-9.webp
- Full page it was cut from: https://kage-design-assets.t3.tigrisfiles.io/screenshots/rocketmoney-com/33d2822e-a753-4b7c-bf3f-3f514d417ce5-1789146528240-full.webp
- Component on Kage: https://kage.design/component/rocketmoney-footer

## Before you start
Ask what products, destinations, support resources, download options, and legal disclosures the user's company needs. Ask for the brand's dark-mode palette and accessibility requirements.

Build a large responsive footer with a near-black background around #111111 and white or #F5F5F5 text. Use a max-width content container with a left company/product description area and three or four right-side link columns. Group links under clear 14–16px headings, use 13–15px links with comfortable vertical gaps, and include social controls plus app-download badges or equivalent product entry points near the lower portion. Finish with a separated legal area containing copyright and compact disclosures in 11–13px muted text. Use 72–96px top padding, 48–64px column gaps, thin #333333 dividers where useful, and 12–16px radius for download controls. Keep external/download actions visibly distinct, support keyboard focus, and collapse columns into readable stacks on mobile.

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

More components