We are adding support for Nextjs. Get in touch on Twitter to learn more.

Add a hero

Let's start by adding a hero to the page.

We are going to use components to build the hero.

content/pages/about.mdx

---
title: Welcome to Reflex
excerpt: Description for this page. This is mostly used for the description meta tag.
---
<Section>
  <Container>
    <H1>Welcome to my site</H1>
    <P>This is the a short description for the page</P>
    <Image src="placeholder.jpg" />
  </Container>
</Section>

This will render a hero as shown below:

Preview

Welcome to my site

This is the a short description for the page

Place the placeholder.jpg image file inside the /content/images directory.

Build a landing page Style the hero