Skip to content
markdown→html

Element Converter

Markdown List to HTML

Paste a Markdown list to generate clean HTML list markup instantly. The converter maps -, *, and + markers to <ul>, numbered items to <ol>, indented items to nested lists, and GFM task lists to checkboxes.

input.md

Shopping list

  • Apples
  • Oranges
    • Blood oranges
  • Flour

Release steps

  1. Run the tests
  2. Tag the release
  3. Publish

Tasks

  • Write the Markdown
  • Copy the HTML
38 words185 chars✓ HTML 0 B

Key facts

Input markers
-, *, + (unordered); 1. (ordered)
Output elements
<ul>, <ol>, <li>
Nesting
2–4 space indentation per level
Task lists
<input type="checkbox"> (GFM)

How do Markdown lists convert to HTML?

Markdown lists convert to <ul> or <ol> elements. Unordered markers (-, *, +) become <ul> with <li> children. Numbered lines (1., 2.) become <ol> with <li> children. Each list item maps to one <li> element.

List markers must start the line, followed by a space. The 3 unordered markers (-, *, +) produce identical <ul> output. For the full authoring rules, see Markdown Lists.

markdown
- Apples
- Oranges

1. First
2. Second
html
<ul>
  <li>Apples</li>
  <li>Oranges</li>
</ul>
<ol>
  <li>First</li>
  <li>Second</li>
</ol>

How do nested lists convert to HTML?

Nested lists convert to a <ul> or <ol> placed inside the parent <li>. Indenting an item 2–4 spaces under its parent creates one nesting level. Each additional indent level nests one element deeper.

Indentation depth drives the structure: align the nested marker with the first character of the parent item's text. Mixed nesting works — an ordered list nests inside an unordered parent and vice versa.

markdown
- Fruit
  - Apples
  - Oranges
html
<ul>
  <li>Fruit
    <ul>
      <li>Apples</li>
      <li>Oranges</li>
    </ul>
  </li>
</ul>

How do task lists convert to HTML?

Task lists convert to list items containing a disabled checkbox input. The GFM syntax - [x] emits <input type="checkbox" checked disabled>, and - [ ] emits the same input unchecked, inside the <li>.

Task lists are a GitHub Flavored Markdown extension, not core Markdown — see GitHub Flavored Markdown for the full extension set. This converter enables GFM, so task lists convert exactly as GitHub renders them. Authoring rules live in Markdown Task Lists.

markdown
- [x] Write the Markdown
- [ ] Copy the HTML
html
<ul>
  <li><input type="checkbox" checked disabled> Write the Markdown</li>
  <li><input type="checkbox" disabled> Copy the HTML</li>
</ul>

Do ordered lists keep their source numbering?

No. HTML renders <ol> items sequentially from the start value, regardless of the numbers in your Markdown source. A list beginning at a number other than 1 emits a start attribute on the <ol>.

Writing 1. for every item is valid — the rendered list still counts 1, 2, 3. Only the first item's number matters: starting at 5. emits <ol start="5">.

markdown
5. Fifth step
5. Sixth step
html
<ol start="5">
  <li>Fifth step</li>
  <li>Sixth step</li>
</ol>

Frequently Asked Questions

Why is my nested list not working?
Nested items need 2–4 spaces of indentation, aligned with the first character of the parent item's text. Tabs or a single space often fail. Match the parent's text column and the list nests.
When should I use an ordered list instead of an unordered list?
Use an ordered list (<ol>) when sequence matters — steps, rankings, instructions. Use an unordered list (<ul>) when it does not. Search engines and screen readers treat the two structures differently.
Are converted task-list checkboxes clickable?
No. Converters emit the checkboxes with the disabled attribute, matching GitHub's rendering. Remove disabled from the HTML output if you need interactive checkboxes on your page.
Does it matter what numbers I use in an ordered list?
Only the first number matters. It sets the list's start value; every following item renders sequentially regardless of its source number. Many writers use 1. for every line to simplify reordering.