opencode.ai
Design analysis
A focused product sub-feature explains optimized model access, reinforces it with a compact provider row, and ends with a secondary learn-more action.
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/opencode-2-0/565a21f1-5840-46fe-9e23-a71210513fd4-1791957897-6.webp - Full page it was cut from: https://kage-design-assets.t3.tigrisfiles.io/screenshots/opencode-2-0/565a21f1-5840-46fe-9e23-a71210513fd4-1791957827568-full.webp - Component on Kage: https://kage.design/component/opencode-2-0-feature-grid-2 ## Before you start Ask what adjacent feature or integration the user's product should promote and which partners or capabilities are genuinely relevant. Apply this layout to those answers. Build a focused feature section with a bold heading, a two-to-three-line explanatory paragraph, a horizontal row of abstract provider/category marks, and a light secondary CTA. Keep the content left aligned in a constrained column. Use a 14–16px heading, 13–15px body copy with 1.7 line height, and small monochrome marks with ample spacing. The section should feel quieter than the hero: white background, thin border separation, #111 text, #777 body text, and a white button with a light #d9d9d9 border, 4px radius, and arrow. On smaller screens, wrap the marks and retain a clear button target. Never: use the reference logo, product name, copy, illustrations, or imagery.
kage