This is for ~~strikethrough~~ deleted text

<p>This is for <del>strikethrough</del> deleted text</p>

This is ==marked== or ==highlighted== text

<p>This is <mark>marked</mark> or <mark>highlighted</mark> text</p>

```json
{
  "firstName": "John",
  "lastName": "Gruber",
  "markdown": ["GFM", "MDX"]
}
```

<div class="sourceCode" id="cb1"><pre class="sourceCode json">
<code class="sourceCode json"><span id="cb1-1"><a href="#cb1-1" aria-hidden="true" tabindex="-1"></a><span class="fu">{</span></span>
<span id="cb1-2"><a href="#cb1-2" aria-hidden="true" tabindex="-1"></a>  <span class="dt">&quot;firstName&quot;</span><span class="fu">:</span> <span class="st">&quot;John&quot;</span><span class="fu">,</span></span>
<span id="cb1-3"><a href="#cb1-3" aria-hidden="true" tabindex="-1"></a>  <span class="dt">&quot;lastName&quot;</span><span class="fu">:</span> <span class="st">&quot;Gruber&quot;</span><span class="fu">,</span></span>
<span id="cb1-4"><a href="#cb1-4" aria-hidden="true" tabindex="-1"></a>  <span class="dt">&quot;markdown&quot;</span><span class="fu">:</span> <span class="ot">[</span><span class="st">&quot;GFM&quot;</span><span class="ot">,</span> <span class="st">&quot;MDX&quot;</span><span class="ot">]</span></span>
<span id="cb1-5"><a href="#cb1-5" aria-hidden="true" tabindex="-1"></a><span class="fu">}</span></span></code></pre></div>

| element                                                                               | description                                      |
| ------------------------------------------------------------------------------------- | ------------------------------------------------ |
| [**`<table>`**](https://html.spec.whatwg.org/multipage/tables.html#the-table-element) | represents tabular data                          |
| [**`<thead>`**](https://html.spec.whatwg.org/multipage/tables.html#the-thead-element) | a block of rows that consist of labels (headers) |
| [**`<th>`**](https://html.spec.whatwg.org/multipage/tables.html#the-th-element)       | header cell in a table.                          |
| [**`<tbody>`**](https://html.spec.whatwg.org/multipage/tables.html#the-tbody-element) | a block of rows that consist of body data        |
| [**`<tr>`**](https://html.spec.whatwg.org/multipage/tables.html#the-tr-element)       | a row of cells                                   |
| [**`<td>`**](https://html.spec.whatwg.org/multipage/tables.html#the-td-element)       | a data cell                                      |

<table>
  <thead>
    <tr class="header">
      <th>element</th>
      <th>description</th>
    </tr>
  </thead>
  <tbody>
    <tr class="odd">
      <td><a href="https://html.spec.whatwg.org/multipage/tables.html#the-table-element"><strong><code>&lt;table&gt;</code></strong></a></td>
      <td>represents tabular data</td>
    </tr>
    <tr class="even">
      <td><a href="https://html.spec.whatwg.org/multipage/tables.html#the-thead-element"><strong><code>&lt;thead&gt;</code></strong></a></td>
      <td>a block of rows that consist of labels (headers)</td>
    </tr>
    <tr class="odd">
      <td><a href="https://html.spec.whatwg.org/multipage/tables.html#the-th-element"><strong><code>&lt;th&gt;</code></strong></a></td>
      <td>header cell in a table.</td>
    </tr>
    <tr class="even">
      <td><a href="https://html.spec.whatwg.org/multipage/tables.html#the-tbody-element"><strong><code>&lt;tbody&gt;</code></strong></a></td>
      <td>a block of rows that consist of body data</td>
    </tr>
    <tr class="odd">
      <td><a href="https://html.spec.whatwg.org/multipage/tables.html#the-tr-element"><strong><code>&lt;tr&gt;</code></strong></a></td>
      <td>a row of cells</td>
    </tr>
    <tr class="even">
      <td><a href="https://html.spec.whatwg.org/multipage/tables.html#the-td-element"><strong><code>&lt;td&gt;</code></strong></a></td>
      <td>a data cell</td>
    </tr>
  </tbody>
</table>

Term
: Definition
: Second Definition

**dog**
: A domesticated canid, Canis familiaris, bred in many varieties.
: Any carnivore of the dog family Canidae, having prominent canine teeth and, in the wild state, a long and slender muzzle, a deep-chested muscular body, a bushy tail, and large, erect ears.

**cat**<sup>1<sup>
: [kat] _/ kæt /_
: A small domesticated carnivore, Felis domestica or F. catus, bred in a number of varieties.
: Any of several carnivores of the family Felidae, such as the lion, tiger, leopard, jaguar, etc.
: A devotee of jazz.
: A soft, indestructible automaton provided by nature to be kicked when things go wrong in the domestic circle.

**cat.**<sup>4<sup>
: Catalog; catalogue.
: Catechism.

- [x] Start
- [ ] Continue
- [ ] Stop

<ul class="task-list">
  <li><label><input type="checkbox" checked="" />Start</label></li>
  <li><label><input type="checkbox" />Continue</label></li>
  <li><label><input type="checkbox" />Stop</label></li>
</ul>

This has a footnote[^1]. This is another footnote[^2].
[^1]: example footnote

[^2]: A _multiline_ footnote
    with a [link](/) and a codeblock

    ```shell
    rm index.html
    ```

<p>
  This has a footnote<a href="#fn1" class="footnote-ref" id="fnref1" role="doc-noteref"><sup>1</sup></a>. This is another footnote<a
    href="#fn2"
    class="footnote-ref"
    id="fnref2"
    role="doc-noteref"
  ><sup>2</sup></a>.
</p>
<section id="footnotes" class="footnotes footnotes-end-of-document" role="doc-endnotes">
  <hr>
  <ol>
    <li id="fn1"><p>example footnote<a href="#fnref1" class="footnote-back" role="doc-backlink">↩︎</a></p></li>
    <li id="fn2">
      <p>
        A <em>multiline</em> footnote with a <a
          href="/"
        >link</a> and a codeblock
      </p>
      <pre class="shell"><code>rm index.html</code></pre>
      <a href="#fnref2" class="footnote-back" role="doc-backlink">↩︎</a>
    </li>
  </ol>
</section>

:full_moon: full moon, :bulb: bulb

<p>
  🌕 full moon, 💡 bulb
</p>

> [!note]
> This is a note callout. It's a great way to add a little extra information to your markdown.

> [!warning]
> This is a warning callout. Use it to highlight important cautions.

> [!tip]
> This is a tip callout. Perfect for sharing helpful advice.

> [!important]
> This is an important callout. Use it for critical information.

> [!caution]
> This is an cautious callout.

> [!TIP] **Callout** with custom _title_
> Some content shown after opening!
>
>> [!NOTE]
>> Embedded Callout
>>
>>> [!IMPORTANT]
>>> We heard you like callouts. So we put a callout in your callout, so you can callout, while you callout.

> [!NOTE]- This is a **collapsible** callout
> Some content shown after opening!
>
>> [!NOTE]-
>> Embedded Callout

<div class="callout" data-callout="note" data-collapsible="false">
  <div class="callout-title">
    <div class="callout-title-icon" aria-hidden="true">
      <svg
        xmlns="http://www.w3.org/2000/svg"
        width="1em"
        height="1em"
        viewbox="0 0 24 24"
        fill="none"
        stroke="currentColor"
        stroke-width="2"
        stroke-linecap="round"
        stroke-linejoin="round"
      >
        <line x1="18" y1="2" x2="22" y2="6"></line>
        <path d="M7.5 20.5 19 9l-4-4L3.5 16.5 2 22z"></path>
      </svg>
    </div>
    <div class="callout-title-text">Note</div>
  </div>
  <div class="callout-content">
    <p>This is a note callout. It's a great way to add a little extra information to your markdown.</p>
  </div>
</div>

### Default ID

#### Custom ID {#custom-id}