Skip to content

Tutorial: build a landing page

Let’s build a simple landing page end-to-end and publish it.

  1. New project. From the dashboard, click New project to open a blank canvas.

  2. Header. Add a Section, set its layout to a horizontal Stack, and drop in a logo (Image), a Menu, and a Button. Save it as a component so you can reuse it — see Components.

  3. Hero. Add a Section with a Heading, a paragraph Text, and a Button. Centre them with the Layout controls. Add a split-text entrance animation to the heading for a bit of polish.

  4. Features. Add a Grid (3 columns) of cards — an icon, a title and a line of text each. Bind colours to your Assets tokens so they stay consistent.

  5. Footer. Add a Section, mark the layout as your Footer (site parts) so it’s reusable.

  6. Go responsive. Add Tablet and Phone breakpoints and tune spacing / stacking for each.

  7. Publish. Hit Publish — your page is live at its own URL, clean and fast.