Features

Core

Everything in this section is part of the core CSS bundle — typography, layout, and dark mode, always loaded and under 1KB gzipped (_sass/mold.scss).

Headings

H1

H2

H3

H4

H5

H6

Paragraphs

Quisque egestas convallis ipsum, ut sollicitudin risus tincidunt.

Maecenas interdum malesuada egestas.

Lists

Ordered list

First item
Second item
Third item

Unordered list

Top level
- Nested level
  - Nested level

Task list

Incomplete item
- Completed sub-item
- Completed sub-item
- Incomplete sub-item

Description list

Sun: Daytime example
Moon: Nighttime example

Block quote

Example block quote.

– Source

Horizontal rule

Text after a horizontal rule.

Images

Regular image: Day Landscape

Dark-mode inverted image: Night Landscape

Tables

Name	Role	Focus
Maria Anders	Lead Navigator	Cartography
Helen Bennett	Tech Specialist	Communication
Giovanni Rovelli	Research Lead	Analysis

Links

https://yree.io

Footnotes

Footnote example¹, plus another one².

Code

Inline code

This is inline code.

Plain text

Plain text example.

Bash

if [ $? -ne 0 ]; then
  echo "Command failed.";
  #adapt and overcome
fi;

Keyboard input

Press Ctrl + C to copy, and Ctrl + V to paste.

Math

\[\begin{equation} \sum_{n=1}^\infty 1/n^2 = \frac{\pi^2}{6} \end{equation}\]

Mermaid

graph TD; A[Markdown]-->B[Core]; A-->C[Components];

Components

These elements are part of the components bundle — loaded when css: full (default), keeping the full stylesheet under 2KB gzipped (_sass/mold-components.scss). Set css: core to exclude them entirely.

Buttons

Forms

Input types

Grid layout

Details

More information

Hidden content appears here.

Dialog

Meters and progress

Storage: 2 out of 10 Completion: 60% Upload: 70%

Cards

Static card

This card is not clickable.

Linked card

This card is clickable.

First footnote. ↩
Second footnote. ↩