---
title: "Nuxt"
description: "A minimal example showing how to use Comark Syntax with Nuxt UI."
canonical_url: "https://comark.dev/examples/frameworks/nuxt"
---
# Nuxt

> A minimal example showing how to use Comark Syntax with Nuxt UI.

<code-explorer org="comarkdown" repo="comark@afa4b18a806217d4b6a09696377435e77b582870" path="examples/1.frameworks/nuxt" defaultValue="content/posts/comark-syntax.md"></code-explorer>

<browser src="https://comark-nuxt.vercel.app/blog/comark-syntax"></browser>

This example demonstrates how to use Comark Syntax with Nuxt UI. Comark Syntax automatically detects when Nuxt UI is installed and uses its components for rendering. Simply add both `@comark/nuxt` and `@nuxt/ui` modules to your Nuxt config, and the `Markdown` component will use Nuxt UI components automatically.

## What does `@comark/nuxt` module do

- Registers the `<Markdown>` and `<MarkdownDocument>` components in Nuxt for automatic import.
- Registers the `~/components/prose` directory in the app and all layers as a global components directory.
  - This allows users to override prose components by creating components in this directory.
- Detects Nuxt UI and tells Nuxt UI to register its Prose components


## Sitemap

See the full [sitemap](https://comark.dev/sitemap.md) for all pages.