Kage Design logo kage
neon.tech
neon.tech feature grid component

Design analysis

A dark feature band explains database branching through a large headline, a central branch timeline visualization, and three concise supporting benefits.

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/neon-tech/ec270806-81ac-4f67-8b23-bd56e790768f-1789141962-5.webp
- Full page it was cut from: https://kage-design-assets.t3.tigrisfiles.io/screenshots/neon-tech/ec270806-81ac-4f67-8b23-bd56e790768f-1789139044100-full.webp
- Component on Kage: https://kage.design/component/neon-feature-grid-3

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

Create a tall dark feature section with a small dotted motif, a centered or right-weighted 42–50px headline, and a muted explanatory line. Place a wide branch/timeline diagram below: thin horizontal and vertical paths, labeled pill nodes, branch points, and a subtle vertical grid. Under the diagram, use three equal columns for benefits, each with a small line icon, bold title, and 2–3 lines of muted copy. Use #000, #f4f4ef, #777d7b, #303735, and #36d5a0. Keep the diagram airy, use monospace labels sparingly, and animate nodes or path emphasis on hover without compromising accessibility.

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

More components