Kage Design logo kage
public.com
public.com feature grid component

Design analysis

A second light feature section uses a bold editorial heading and a modular grid of account, income, indexing, earnings, and order-management capabilities with embedded UI previews.

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-1789146536-5.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-feature-grid-4

## 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 modular feature gallery for a financial product. Open with a centered eyebrow and large serif title plus a lighter secondary line, then show two columns of feature blocks with centered titles, concise descriptions, small “Learn more” links, and realistic but generic interface previews. Include one full-width feature between the two-column rows to create a varied rhythm. Use a mostly white canvas, very pale gray preview surfaces (#FAFAFA), black headings, gray copy, thin #EEEEEE rules, 12–16px preview radii, and substantial 80–120px vertical separation between groups. Keep previews visually subordinate to the copy and preserve a consistent baseline and column gutter.

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

More components