Kage Design logo kage
hypervibe.so
Hypervibe feature grid component

Design analysis

A focused feature band explains voice interaction with a short narrative and one prominent product visual.

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/hypervibe/0f025394-2dff-4c9b-be5f-8e394ec4a30f-1791699114-4.webp
- Full page it was cut from: https://kage-design-assets.t3.tigrisfiles.io/screenshots/hypervibe/0f025394-2dff-4c9b-be5f-8e394ec4a30f-1791699070438-full.webp
- Component on Kage: https://kage.design/component/hypervibe-feature-grid-2

## Before you start
Ask what differentiating interaction the user's product offers and what user outcome it improves. Then create a focused feature band around that outcome.

Build a left-aligned feature section with a numbered eyebrow, a strong two-line heading, and a compact paragraph that explains the interaction in practical terms. Follow it with one large rounded interface visual centered within the same content rail. Use a dark black canvas, off-white typography, muted gray copy, a thin divider or hairline above the section, and a warm accent for tiny labels or controls. Keep the image generous and cinematic, with a 12–16px radius and subtle border. Add captions or controls only when they clarify the feature; avoid decorative UI clutter.

### Never
- Never use logos, product names, copy, illustrations, or imagery from the reference.
- Never copy the reference voice feature or screenshot.
- Never make the supporting paragraph longer than the visual needs.

More components