1. Documentation
  2. Basic Styling
  3. Lists
ReadmeGitHub
  • Introduction
  • Quickstart
  • Text
  • Code
  • Lists
  • Tables
  • Accordion
  • Badge
  • Button
  • Callout
  • Code Block
  • Code Block Group
  • Code Snippet
  • Columns
  • Custom components
  • GitHub
  • Hover Card
  • Mermaid
  • Properties
  • Related Topics
  • Tabs
  • Tree
  • Images
  • Video
  • Files
  • Grain
  • Shade
  • Moss
  • Configuration
  • Content
  • Navigation
  • Site Identity
  • Appearance
  • Header and Footer
  • Fonts
  • Icons
  • Integrations
  • Search
  • OpenAPI
  • AI Chat
  • React Router
  • Astro
  • Next.js
  • Cloudflare
  • Vercel
  • robots.txt
  • sitemap.xml
  • JSON-LD
  • rss.xml
  • llms.txt
  • llms-full.txt
  • .md endpoints

Lists

Turn repeated steps, options, and checklists into content readers can scan quickly.

Loading documentation…

Code< PreviousTablesNext >

Powered by heyo

On this page

Use ordered lists for a sequenceUse bullets for equal choicesNest detail sparinglyProperties
  • Create the page
  • Add it to navigation
  • Preview the result locally
- Create the page- Add it to navigation- Preview the result locally

Lists make repeated information easier to scan than a long paragraph. Use them when each item can stand on its own: a sequence of steps, a set of choices, a group of requirements, or a short checklist.

Use ordered lists for a sequence

Use an ordered list when the reader must complete actions in order. Keep one item focused on one action; if an item needs several paragraphs or a command, give that task its own heading instead.

md
1. Create `content/guides/first-page.mdx`.2. Add `guides/first-page` to the navigation.3. Start the local development server.

This pattern works for installation, deployment, and migration instructions, where completing a later step too early can cause an error. The number is part of the instruction, so do not use it merely to make a group of links look more structured.

Use bullets for equal choices

Use a bulleted list when the items are alternatives, outcomes, requirements, or checks with no required order. Start every item with the same kind of word—for example, a verb for actions or a noun for supported features—so the list is easy to compare at a glance.

Before publishing, confirm that:

  • every page has a descriptive title;
  • internal links use a relative path; and
  • screenshots describe their purpose in alt text.
Before publishing, confirm that:- every page has a descriptive title;- internal links use a relative path; and- screenshots describe their purpose in alt text.

This is useful for pre-publish checks and capability summaries. If a list item needs a binary state, make it a checkbox only when the reader can meaningfully complete it in the current context.

Nest detail sparingly

Indent a child list only when it clarifies the parent item. One level of nesting is usually enough for a parent task and its supporting detail; deeper nesting makes a documentation page difficult to follow, especially on a narrow screen.

md
1. Configure the site.   - Set the title and description.   - Choose the content directory.2. Add the first guide.

Use this form for a small setup procedure or a concise release checklist. For a complex workflow, prefer separate H2 or H3 sections so readers can link to and return to each part of the process.

Properties

- itemunordered listoptional

Creates a bulleted list item. Use it for alternatives, requirements, outcomes, and checklists where order does not change the result.

1. itemordered listoptional

Creates a numbered list item. Use it for instructions that must be completed in sequence.

indentationnested listoptional

Indent a child item beneath its parent to add supporting detail. Keep nesting shallow so the instructions remain easy to scan.

- [ ] itemtask itemoptional

Creates an unchecked task item in Markdown. Use it only when the checklist represents an action the reader can complete.