Write content

Documentation pages are written in MDX, which combines Markdown with React components. Create .mdx files in the docs/pages/ directory and reference them in your docs.yml navigation.

Quick example

Here’s a minimal page with frontmatter and Markdown content:

1
---
2
title: Page title
3
subtitle: Optional subtitle
4
slug: my-page
5
---
6
7
Your content here. Use standard Markdown formatting like **bold**, *italic*, and `code`.
8
9
## Headings
10
11
Use headings to organize your content.

Using components

Fern provides built-in components for common documentation patterns. Each example below shows the rendered component followed by the MDX that produces it.

Callouts

Use callouts to highlight important information.

1
<Note>
2
Highlight important information with callouts.
3
</Note>

Cards

Use cards to link to related pages.

1
<CardGroup cols={2}>
2
  <Card title="Set up navigation" icon="duotone compass" href="/navigation">
3
    Structure your docs with tabs, sections, and pages
4
  </Card>
5
  <Card title="Customize your docs" icon="duotone palette" href="/customization">
6
    Change colors, fonts, and layout to match your brand
7
  </Card>
8
</CardGroup>

More components

Explore the full set of built-in components and click through to the Fern documentation for detailed usage guides.