Kage Design logo kage
oku.club
oku.club feature grid component

Design analysis

Two equal feature cards sit side by side, each combining a centered outcome-oriented heading with a tall mobile interface preview.

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/oku-club/e710a983-c1d6-4177-b014-2738acd07d09-1789146243-4.webp
- Full page it was cut from: https://kage-design-assets.t3.tigrisfiles.io/screenshots/oku-club/e710a983-c1d6-4177-b014-2738acd07d09-1789146208773-full.webp
- Component on Kage: https://kage.design/component/oku-club-feature-grid-2

## Before you start
Ask what user-created collections, collaboration, or review workflows the product supports. Ask which brand tone and interface assets should guide the design.

Build a two-column feature card row with equal-width, pale-gray cards. Give each card a centered serif heading at the top and a tall, partially cropped mobile UI preview below, allowing the device to extend toward the lower edge. The left card should represent organizing or saving; the right should represent social proof, feedback, or collaboration. Keep the cards visually related but let the UI previews provide the differentiation.

Use `#f4f4f4` cards, `#090909` headings, `#666666` optional supporting copy, 10px radius, 32–44px top padding, and a 16px column gap. On narrow screens, stack the cards and reduce the device scale while keeping the heading readable.

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

More components