Kage Design logo kage
conifer.build
Parallax feature grid component

Design analysis

This band combines a dramatic quantitative proof point with a comparison chart, then follows with a code-and-explanation pairing that demonstrates why the result is credible.

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/parallax/9ca98bac-0bc3-4cc4-b310-031492d1188c-1792216893-3.webp
- Full page it was cut from: https://kage-design-assets.t3.tigrisfiles.io/screenshots/parallax/9ca98bac-0bc3-4cc4-b310-031492d1188c-1792216865980-full.webp
- Component on Kage: https://kage.design/component/parallax-feature-grid-2

## Before you start
Ask what measurable outcome proves the user's product is valuable and what real workflow demonstrates it. Then use those inputs to create original proof-oriented content.

Create a vertically flowing proof section with two alternating two-column rows. In the first row, put an oversized accent-colored metric and a short serif headline/body copy on the left; put a dark rounded comparison chart on the right. The chart should have a compact title, ranked rows, horizontal bars, labels, and one clearly highlighted leading result. In the second row, reverse the visual rhythm: place an original dark code-review panel on the left and explanatory serif heading plus sans-serif paragraphs on the right. The code panel should include syntax-colored lines, a reviewer message, and a highlighted recommendation card. Use near-black `#0b0b0b`, panels `#17191d`, borders `#2b2e33`, warm white `#eeeae5`, gray `#969194`, pink-red `#e94168`, and restrained green for positive review states. Use large display typography for the metric, compact monospace for code, and generous vertical separation so the two rows feel like distinct evidence moments. Ensure charts remain legible and cards stack on mobile.

Never:
- use logos, product names, or copy from the reference
- claim or reuse the reference benchmark numbers
- copy its chart, code, illustrations, or imagery

More components