TypMark Showcase

This is a hands-on cheat sheet that pairs TypMark input with rendered output. Each section shows how to write it and what you should see.

Headings

TypMark

# H1## H2### H3

Output

H1

H2

H3

Paragraphs and Line Breaks

TypMark

This is one paragraph.This line is in the same paragraph.This is a new paragraph.

Output

This is one paragraph. This line is in the same paragraph.

This is a new paragraph.

Emphasis and Inline Code

TypMark

*emphasis* **strong** `code` ~~strikethrough~~

Output

emphasis strong code ~~strikethrough~~

Escaping

TypMark

\*not emphasis\* \`not code\`

Output

*not emphasis* `not code`

Inline Formatting Mix

TypMark

This has **bold and *nested emphasis*** plus `code`.

Output

This has bold and nested emphasis plus code.

Links

TypMark

[Typst](https://typst.app)<https://example.com>

Output

Typst https://example.com

Reference Links

TypMark

See [Docs][docs].[docs]: https://example.com/docs "Docs"

Output

See Docs.

Images

TypMark

![Alt text][logo][logo]: data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20width%3D%27120%27%20height%3D%2740%27%3E%3Crect%20width%3D%27120%27%20height%3D%2740%27%20fill%3D%27%23f0f0f0%27/%3E%3Ctext%20x%3D%2710%27%20y%3D%2726%27%20font-size%3D%2716%27%20fill%3D%27%23333%27%3ETypMark%3C/text%3E%3C/svg%3E

Output

Alt text

Remote Image

TypMark

![Typst logo](https://gist.github.com/fenjalien/1463a19ba2b91d061ed35e295494e0b3/raw/2d5079562396d43e615cf0ffe81da60438b184c9/typst-logo.png)

Output

Blockquotes

TypMark

> Quote line one.>> Quote line two.

Output

Quote line one.

Quote line two.

Lists

TypMark

- Item one- Item two  - Nested item1. First2. Second

Output

Item one
Item two
- Nested item

First
Second

Task Lists

TypMark

- [x] Done- [ ] Todo

Output

Done
Todo

Code Blocks

TypMark

```plain code blockline two``````rustfn main() {    println!("hello");}```

Output

plain code blockline two

fn main() {    println!("hello");}

Code with Attributes

TypMark

```js {#demo data-demo=enabled}console.log("hello");```

Output

console.log("hello");

Code Highlights and Diffs

TypMark

```c {hl="2:printf" diff_del="3" diff_add="4"}int a = 1;printf("hi");int b = 2;int c = 3;```

Output

int a = 1;printf("hi");int b = 2;int c = 3;

Math

TypMark

Inline math: $a^2 + b^2 = c^2$$$integral_0^1 x^2 dif x$$

Output

Inline math:

Tables

TypMark

| Name | Value ||:-----|------:|| Alpha | 1 || Beta | 2 |

Output

Name	Value
Alpha	1
Beta	2

Boxes

TypMark

::: box NoteThis is a note box.:::

Output

Note

This is a note box.

Boxes with Attributes

TypMark

{#custom bg="#f0f0f0" border-style="solid" border-width="2px" title-bg="#e0e0e0"}::: box StyledThis box has custom styles.:::

Output

Styled

This box has custom styles.

Horizontal Rules

TypMark

***---___

Output

Raw HTML

TypMark

<details><summary>Raw HTML</summary><p>Details content.</p></details>

Output

Raw HTML

Details content.