Skip to main content

Your First Page

A Micropage site is a text file. One element per line, no nesting, a closed vocabulary of elements.

Here is a complete waitlist page — the Harbor example, the same one in the Markup Cheatsheet and llms.txt:

[site]
title: Harbor
description: A waitlist

[nav]
Pricing -> /pricing
btn: Join -> /#waitlist

[Home -> /]

/// hero
h1: Launch the waitlist tonight
p: Edit this file. Publish. Collect email.
button: Join the list -> /#waitlist

/// section
form: waitlist
input: Email*
submit: Get early access

That file is the whole site. The form is live once you publish it; submissions land in the Form Submissions tab.

Structure​

A typical file contains, in order:

  • a [site] block — title, description, logo, colors
  • optional [nav] and [footer] blocks
  • one or more page blocks: [Home -> /], [Pricing -> /pricing]
  • sections inside each page: /// hero, /// section

Sections​

Sections are the layout blocks. Elements belong to the section above them.

/// section
h2: What Harbor gives you
p: A file you can read and edit
p: A form that stores every submission

Both /// hero and /// section accept align:center and bg:primary|secondary|muted|success|info.

Images​

Use img: and point it at a file with <-. Uploaded project files are the default:

/// section
img: <- hero.png

Upload the file in the Files tab, then reference it by its exact filename. Filenames are case-sensitive. With the CLI, anything in the project's assets/ folder is uploaded on push.

Two other forms exist, mostly for a first draft:

  • keyword — img: <- coffee searches Unsplash for a matching photo. Replace it with a real file before you ship.
  • URL — img: <- https://example.com/photo.jpg downloads the file once and stores it in the project.

You can also write image: instead of img:; both are equivalent. See Images and Components & Aliases for the full reference.

Publishing​

Web app: click Publish in the editor toolbar. Save only stores a draft.

CLI (Pro and Pro+):

micropage publish