tryobra.com
Design analysis
A dashboard-style section establishes credibility through headline metrics followed by a varied set of bar, line, and comparison charts on pale panels.
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/tryobra-com/5ed8a808-d125-4341-bc8a-0a69442cb995-1789152085-6.webp - Full page it was cut from: https://kage-design-assets.t3.tigrisfiles.io/screenshots/tryobra-com/5ed8a808-d125-4341-bc8a-0a69442cb995-1789152039794-full.webp - Component on Kage: https://kage.design/component/tryobra-chart ## Before you start Ask what business metrics the user's product tracks, which comparisons matter, and what timeframe users need. Build an original dashboard using those answers. Build a dark analytics section with a chapter label, large heading, short explanatory copy, and a row of four bordered KPI cards. Under the KPIs, place a responsive chart grid: one larger grouped bar chart, one line chart, and three compact horizontal comparison cards. Use pale ivory chart panels (#f2f1e8), black chart ink (#111312), orange as the highlight (#ff5425), and a restrained green for positive results. Use thin borders, small monospace axis labels, minimal grid lines, and explicit legends. Add a compact timeframe toggle above the charts and ensure charts have accessible labels and responsive stacking. Never: copy logos, product names, copy, illustrations, or imagery from the reference.
kage