> For clean Markdown of any page, append .md to the page URL.
> For a complete documentation index, see https://docs.whizcozy.com/writing-content/llms.txt.
> For AI client integration (Claude Code, Cursor, etc.), connect to the MCP server at https://docs.whizcozy.com/_mcp/server.

# 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:

**`docs/pages/my-page.mdx`**

```markdown title="docs/pages/my-page.mdx"
---
title: Page title
subtitle: Optional subtitle
slug: my-page
---

Your content here. Use standard Markdown formatting like **bold**, *italic*, and `code`.

## Headings

Use headings to organize your content.
```

## Using components

Fern provides [built-in components](https://buildwithfern.com/learn/docs/writing-content/components/overview) 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.

> **Note**
>
> Highlight important information with callouts.

**`my-page.mdx`**

```jsx title="my-page.mdx"
<Note>
Highlight important information with callouts.
</Note>
```

### Cards

Use cards to link to related pages.

#### [Set up navigation](/navigation)

Structure your docs with tabs, sections, and pages

#### [Customize your docs](/customization)

Change colors, fonts, and layout to match your brand

**`my-page.mdx`**

```jsx title="my-page.mdx"
<CardGroup cols={2}>
  <Card title="Set up navigation" icon="duotone compass" href="/navigation">
    Structure your docs with tabs, sections, and pages
  </Card>
  <Card title="Customize your docs" icon="duotone palette" href="/customization">
    Change colors, fonts, and layout to match your brand
  </Card>
</CardGroup>
```

## More components

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

#### [Component library](https://buildwithfern.com/learn/docs/writing-content/components/overview)

Browse callouts, cards, tabs, accordions, and more

#### [Markdown syntax](https://buildwithfern.com/learn/docs/writing-content/markdown)

Format text, links, lists, tables, and code blocks

> Create documentation pages using MDX