Essentials
Components
Use markdown components to structure your content.
Prose components are replacements for HTML typography tags. They provide a simple way to customize your UI when using Markdown.
Docora ships a set of styled prose components so you can write documentation with MDC syntax — no imports. Every example below has a live preview and the source to copy.
Accordion
Use the accordion and accordion-item components to display a collapsible
list of questions and answers.
Badge
Use markdown in the default slot of the badge component to display a badge
in your content.
v0.0.1
Callout
Use markdown in the default slot of the callout component to add
eye-catching context to your content.
Use the icon and color props to customize it. You can also pass to to
turn the whole callout into a link.
You can also use the note, tip, warning and caution shortcuts with
pre-defined icons and colours.
Here's some additional information for you.
Here's a helpful suggestion.
Be careful with this action as it might have unexpected results.
This action cannot be undone.
Card and CardGroup
Use markdown in the default slot of the card component to highlight your
content.
Use the title, icon and color props to customize it. You can also pass
to to turn the card into a link.
Wrap your card components with the card-group component to group them
together in a grid layout.
Collapsible
Wrap your content with the collapsible component to hide it behind a toggle.
Field and FieldGroup
A field is a prop or parameter to display in your content. Group them with
field-group in a list.
site.namestringrequired
The site name, used as the header title fallback.
header.searchboolean
Set to false to remove the search trigger. Defaults to true.
colorMode.forced'light' | 'dark'
Pins the site to one colour mode and hides the toggle.
site.urlstring
Canonical site URL. Enables the sitemap, social images and edit links.
Icon
Use the icon component to display an icon in your content. Names are lucide
in kebab-case, or the Iconify prefix (i-lucide-rocket).
Kbd
Use the kbd component to display a keyboard key in your content.
⌘ K
Tabs
Use the tabs and tabs-item components to display tabs in your content.
Documents are markdown with MDC syntax, so components need no imports.
Steps
Wrap your headings with the steps component to display a list of steps.
Use the level prop to define which heading will be used for the steps.