Marketing
Product demo split hero
An interactive split hero walks through collecting, shaping and sharing a project.
Using Product demo split hero
An interactive split hero walks through collecting, shaping and sharing a project.
A split product hero combines a clear introduction with a navigable project demonstration. Supply your data and handle the exposed callbacks when the host application needs to persist a change.
Move from collecting notes to shaping the work, then return to the previous stage.
The example uses local state. It does not connect to a backend, send messages or persist data after unmounting.
Props: title, accent, state
Which frameworks are available?
The catalog lists these versions: react, vue, svelte, astro, html. The live preview on this page runs React.
How do I access the implementation?
The code, framework versions and installation commands are available in the workbench above.