Buttons and icon links

Open the settings when you like, or use the icon alone: Installation.

Headings

Quark 2 uses Cal Sans for display headings and treats h1 / h2 distinctly — h1 sits at a lighter display weight while h2 is bolder and gains a small accent bar to mark section breaks. h6 is rendered as an uppercase eyebrow label.

Images: shadow and icons in the text

An image on a line with text is an icon: click to read more. It is as high as the line, without border or shadow.

H1 Heading — airy, display weight

H2 Heading — confident, with accent bar

H3 Heading — workhorse section heading

H4 Heading

H5 Heading

H6 Heading — uppercase eyebrow

# H1 Heading
## H2 Heading
### H3 Heading
#### H4 Heading
##### H5 Heading
###### H6 Heading

Paragraphs

Body copy is set in Inter at 16px with a 1.7 line-height and subtle tracking. Links adopt the theme's accent color — by default a restrained charcoal, but configurable to any hex via Themes → Quark 2 → Accent Color.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent risus leo, dictum in vehicula sit amet, feugiat tempus tellus. Duis quis sodales risus. Etiam euismod ornare consequat.

Climb leg rub face on everything give attitude nap all day for under the bed. Chase mice attack feet but rub face on everything hopped up on goofballs.

Markdown Semantic Text Elements

Bold **Bold**

Italic _Italic_

Deleted ~~Deleted~~

Inline Code `Inline Code`

HTML Semantic Text Elements

I18N <abbr>

Citation <cite>

Ctrl + S <kbd>

Text^{Superscripted} <sup>

Text_Subscripted <sub>

Underlined <u>

Highlighted <mark>

20:14 <time>

x = y + 2 <var>

Blockquote

The advance of technology is based on making it fit in so that you don't really even notice it, so it's part of everyday life.

- Bill Gates

> The advance of technology is based on making it fit in so that you don't really even notice it,
> so it's part of everyday life.
>
> <cite>- Bill Gates</cite>

Unordered List

• list item 1
• list item 2
  • list item 2.1
  • list item 2.2
  • list item 2.3
• list item 3

* list item 1
* list item 2
    * list item 2.1
    * list item 2.2
    * list item 2.3
* list item 3

Ordered List

1. list item 1
2. list item 2
   1. list item 2.1
   2. list item 2.2
   3. list item 2.3
3. list item 3

1. list item 1
1. list item 2
    1. list item 2.1
    1. list item 2.2
    1. list item 2.3
1. list item 3

Table

| Name                        | Genre                         | Release date         |
| :-------------------------- | :---------------------------: | -------------------: |
| The Shawshank Redemption    | Crime, Drama                  | 14 October 1994      |
| The Godfather               | Crime, Drama                  | 24 March 1972        |
| Schindler's List            | Biography, Drama, History     | 4 February 1994      |
| Se7en                       | Crime, Drama, Mystery         | 22 September 1995    |

Table options

	Icons with a link beside them: Typography
	A plain table has no lines: Guides

Boxes

A box with one of the page's pictures beside it.

Steps

Collapsible sections

Picture with numbered points

1234

1. A skateboard The first thing that can be used. Point at a number, tab to it or tap it.
2. A bicycle Each step is something whole that works.
3. A car Near the right edge the explanation opens to the left (sw).
4. Not like this A car in parts helps nobody until the last one.

Alerts

Grav 2.0 replaces the legacy markdown-notices plugin with github-markdown-alerts, which renders GitHub-flavored Markdown alerts. Five types are available, each with an accent stripe, icon, and label:

> [!NOTE]
> Highlights information that users should take into account, even when skimming.

> [!TIP]
> Optional information to help a user be more successful.

> [!IMPORTANT]
> Crucial information necessary for users to succeed.

> [!WARNING]
> Critical content demanding immediate user attention due to potential risks.

> [!CAUTION]
> Negative potential consequences of an action.

The Quark 2 theme is Grav's new default, replacing the long-serving Quark (1.x) theme. It pairs a pure-grayscale palette with Cal Sans for display and Inter for body text (both hosted locally), Font Awesome 7 icons, and auto/light/dark appearance that persists in the user's browser. The layout system is CSS Grid + modern custom properties rather than a framework grid.