View source for "commonmark+comrak cheatsheet" [misc gem draft] from 2025-10-22 in sw, web, md.
A cheatsheet for me to reference while writing blogposts.

commonmark (extended) cheatsheet

Specifically, the parts I forget.

frontmatter

ignored at beginning:

---
date: 2025-10-22
title: title
desc: Longer description.
tags: tag1 tag2 tag3
cats: gem draft sw hw rb misc
---

text and tables

| `markdown`  | result    |
|-------------|-----------|
| `**bold**`  | **bold**  |
| `_italic_`  | _italic_  |
| `__under__` | __under__ |
| `a^sup^`    | a^sup^    |
| `a~sub~`    | a~sub~    |
| `~~cut~~`   | ~~cut~~   |

becomes

image captions

to create a figure and figcaption setup, do ![alt described image](/assets/link/to/image "Caption and Title shows up with image")

![back of (new) robot](/assets/rfgy24/back.avif "Back of the new robot")

side by side images

images separated by only one newline or one whitespace show up side-by-side:

![front of (new) robot](/assets/rfgy24/front.avif "Front of the new robot")
![back of (new) robot](/assets/rfgy24/back.avif "Back of the new robot")

spoilers and html

||spoiler||, so darth vader is luke’s daddy

<details><summary>text</summary>show on reveal</details>

darth vader is ||an alligator,  <!-- two spaces -->
20% of the time||

lists

* see this?
- this is it
- enjoyable
3. okay
4. okay again
* [ ] hi
* [x] checked
6. [x] yellow
7. [ ] pink

looks like

• see this?

• this is it
• enjoyable

3. okay
4. okay again

• hi
• checked

6. yellow
7. pink

alerts

> [!note]
> take this info into account

> [!tip]
> get more success

> [!important]  
> crucial to success

> [!warning]  
> immediate attention required

> [!caution]
> tread carefully

> [!note] not a final solution
> later, the pretzel was eaten

makes

Note

take this info into account

Tip

get more success

Important

crucial to success

Warning

immediate attention required

Caution

tread carefully

not a final solution

later, the pretzel was eaten

description lists

term
:   definition

word
:   meaning

for

term1

definition1

term2

definition2

quotes

> single line quote, and

>>>
multi-line
quote
>>>

footnotes

do [^fn1].¹

and, if you want, again (¹)

later, do:

[^fn1]: footnote content

wikilinks

[text content](/posts/wikilink)
like [my iems](/posts/blon-bl03)
shown my iems
and
use (^|[^!])\[[^\]]+\]\(\/[^)]*\) regex to find things you can ’ikilinkify.

math

for data-math-style=inline, $math$ like x^2 + y^2 = z^2

for data-math-style=display, $$math$$: \int_{0}^{1} x^2 , dx = \frac{1}{3}

and for math codeblock, ```math ...```

conclusion

Good for reference!

comment on "commonmark+comrak cheatsheet"