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

Design analysis

A bold statement-led layout explains direct creator–fan relationships beside a tall mobile community interface, making an abstract benefit tangible.

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/patreon-com/f09b5697-c1c9-4600-81d4-e7bb56a9df3f-1789146382-5.webp
- Full page it was cut from: https://kage-design-assets.t3.tigrisfiles.io/screenshots/patreon-com/f09b5697-c1c9-4600-81d4-e7bb56a9df3f-1789146360542-full.webp
- Component on Kage: https://kage.design/component/patreon-feature-grid-3

## Before you start
Ask what the user's product, audience, and brand are, then apply these principles to that context rather than reproducing the reference.

Build a two-column community feature on a blue-toned background. Give the left side a very large multi-line headline, a compact supporting paragraph, and a single dark rounded CTA; use the right side for a tall, rounded mobile UI mockup that demonstrates conversation or activity. Maintain a strong baseline grid, generous whitespace, black primary type, and soft device shadow. On smaller screens, stack the copy above the mockup and preserve the headline's rhythm.

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

More components