Extensions add custom syntax to Markdown. All extensions are built into the
Sarde binary and active by default.
Read Using Extensions for the block (:::)
and inline (:name[]) syntax conventions, nesting rules, and attributes.
Block extensions handle multi-line containers: Aside
(callouts), Tabs, Cards,
Steps, Accordion,
Details, File Tree,
Gallery, Timeline,
Columns, Badge Group,
Link Button Group, and more.
Inline extensions handle text-level markers: Icon,
Kbd, Highlight,
Annotation, Spoiler, and
Copy Text.
Using Extensions
How block and inline extension syntax works, including fenced directives and nesting rules
Accordion
Group collapsible detail sections so opening one closes the others
Aside
Add colored callout blocks for notes, tips, warnings, and dangers that stand out from content
Badges
Display short colored pill labels with optional icons for status, versions, or categories
Cards
Display content in bordered, elevated containers, arranged in a responsive grid
Details
Create a collapsible section with a clickable summary, optionally expanded by default
Figure
Wrap images or other content in a figure element with an optional caption
File Tree
Render directory structures as a styled tree with folder and file icons
Gallery
Display multiple images in a responsive grid with a built-in full-screen lightbox
Image Compare
Compare a before and after image pair with a draggable slider
Link Buttons
Render styled anchor links that look like buttons, with multiple color variants
Link Card
Render a clickable card-style link with a title, description, and optional icon or image
Math
Render inline and block LaTeX math expressions using KaTeX
Mermaid
Render flowcharts, sequence diagrams, and other visualizations from text definitions
Steps
Display a numbered sequence of instructions with a connecting vertical progress line
Tabs
Switch between related content panels, with tab selection synced across the site
Terminal
Render content inside a macOS-style terminal window with automatic line classification
Timeline
Display a vertical sequence of entries with markers for changelogs or milestones
Video
Embed YouTube, Vimeo, or self-hosted video files with a responsive wrapper
Columns
Split content into side-by-side columns with a configurable column count
Badge Group
Wrap multiple badges in a horizontal row with consistent spacing
Link Button Group
Wrap multiple link buttons in a horizontal row with consistent spacing
Annotation
Attach hoverable, keyboard-accessible tooltips to terms inline without breaking the sentence
Copy Text
Turn a text snippet into a one-click clipboard copy styled like inline code
Highlight
Draw attention to key words or phrases with a colored background highlight
Icon
Render inline SVG icons from Lucide or other Iconify-compatible sets
Kbd
Render keyboard keys and key combinations as styled keycaps
Spoiler
Hide text behind a blur until the reader hovers, focuses, or clicks to reveal it
Markdown Basics
A visual reference of all standard Markdown formatting supported by Sarde.
Kitchen Sink
Every Sarde extension on a single page. Use it as a visual reference when authoring content.