Home page

Edit the rocket hero and every home page section.

The whole home page comes from data/home.yaml, so you can change the words without touching any code.

A note on YAML

  • Keep the indentation as it is. It uses spaces, not tabs.
  • If text contains a comma inside { curly brackets }, wrap it in “double quotes”, or it will be cut off.
- { title: "Fewer, better alerts", text: "A daily digest." }

Hero

hero:
  eyebrow: New in Liftoff 2.0
  title: Get your next launch *off the ground*
  text: One or two sentences about what you do.
  primary: { label: Start free, url: /pricing/ }
  secondary: { label: See how it works, url: /features/ }
  note: Free for up to 5 people. No card needed.

Wrap words in *asterisks* to show them in your accent colour. This works in every section title.

Changing the rocket

The rocket, stars and clouds are drawn in layouts/_partials/hero.html and need no image files. They follow your accent colour automatically. Animation speeds are in assets/css/main.css, under the Rocket and Clouds comments. Visitors who ask their device for reduced motion see a still rocket.

Other sections

Section Key in home.yaml Tip
Logo names logos Plain text, so it stays fast
Feature cards features Icons: map, doc, bell, chart, link, lock
Steps and numbers steps, stats Three of each looks best
Testimonials testimonials Use real customers, with permission
Pricing intro pricing Plans come from pricing.yaml
Closing band cta Appears on every page

Replace all the sample names, numbers and quotes with your own before you publish.

To add your own icon, add its SVG path to layouts/_partials/icon.html.

Ready for liftoff?

Set up your first project in under five minutes.