Konwerter Markdown na HTML

Konwertuj Markdown na HTML online z podglądem na żywo. Obsługa GFM (GitHub Flavored Markdown): tabele, checkboxy, fenced code blocks. Bezpłatnie.

Bezpieczne (SSL)

Przetwarzanie Lokalne

100% Darmowe

Przejdź do narzędzia

Instrukcja

1

Wprowadź dane
Wpisz treść, wklej tekst lub załaduj plik z dysku.
2

Kliknij przycisk
Narzędzie natychmiast przetworzy Twoje dane w przeglądarce.
3

Pobierz wynik
Skopiuj gotowy tekst lub zapisz plik na urządzeniu.

                                                function runTool() {

                                                  return "Wynik gotowy w 0.1s";

                                                }

Ustawienia

Tryb

Dane wejściowe

359 znaków

Open new Opcja narzędzia

Wynik

Znaczniki przetłumaczone

16 szt.

znaczniki HTML w wygenerowanym kodzie (h1, p, strong, a…)

Rozmiar przed

359 znaków

wejściowy Markdown

Rozmiar po

574 znaków

wynikowy HTML

Zmiana rozmiaru

59,9 %

dodatnia = HTML jest dłuższy od Markdown

<h1>Markdown to HTML</h1>
<p>Write your content in <strong>Markdown</strong> and convert it to clean HTML.</p>
<h2>Quick examples</h2>
<ul>
<li>Bullet lists</li>
<li><code>Inline code</code></li>
<li><a href="https://example.com" target="_blank" rel="noopener noreferrer">A link</a></li>
</ul>
<pre><code class="language-php">&lt;?php
// Fenced code block
echo &quot;Hello, Toolsti!&quot;;
</code></pre>
<blockquote>
<p>Blockquotes are great for callouts.</p>
</blockquote>
<h3>Tip</h3>
<p>Use Safe HTML for public content. Use Allow HTML only when you trust the input.</p>

mode: safe open new: 1 input len: 359

Ściąga: Markdown → HTML — przykład przeliczony silnikiem narzędzia

Konwersja liczona na serwerze tym samym silnikiem co wynik powyżej (tryb Safe); obie kolumny to tekst pokazywany jako kod — w podglądzie nic się nie wykonuje
Markdown wejściowy	HTML wynikowy
# Notatka Akapit z pogrubieniem, kursywą i `kod`. - punkt A - punkt B	<h1>Notatka</h1> <p>Akapit z <strong>pogrubieniem</strong>, <em>kursywą</em> i <code>kod</code>.</p> <ul> <li>punkt A</li> <li>punkt B</li> </ul>

Ściąga: składnia Markdown, którą tłumaczy konwerter — 1:1 z kodu

silnik używa biblioteki CommonMark (bez rozszerzenia GFM — tabele z pionowych kresek pozostają tekstem); awaryjny konwerter podstawowy składa mniej elementów (bez list numerowanych, hr i obrazów)
Składnia Markdown	Wynik w HTML
# Tytuł … ###### Tytuł	<h1>…<h6> — nagłówki ATX; CommonMark obsługuje też Setext (podkreślenia === i ---) dla H1/H2
tekst	<strong>tekst</strong>
tekst	<em>tekst</em>
`kod`	<code>kod</code>
- punkt / * punkt	<ul><li>…</li></ul> — listy punktowane
1. punkt	<ol><li>…</li></ol> — listy numerowane w CommonMark; awaryjny konwerter podstawowy (bez biblioteki) numerowanych nie składa
[tekst](URL)	<a href="URL">tekst</a>; z włączonym „Open new” każdy <a> bez target dostaje target="_blank" rel="noopener noreferrer"
> cytat	<blockquote>
``` blok kodu ```	<pre><code>…</code></pre> — awaryjny konwerter dodaje klasę language-…, CommonMark zostawia czysty <code>
---	<hr /> — linia pozioma w CommonMark; awaryjny konwerter jej nie rysuje
![alt](src)	<img src="…" alt="…" /> — obrazy w CommonMark
tabele GFM (\| a \| b \|)	NIE są tłumaczone — silnik nie ładuje rozszerzenia GFM, więc tabela zostaje zwykłym akapitem z pionowymi kreskami
HTML w środku (np. <b>, <script>)	tryb Safe: znaczniki zdejmane (html_input=strip), zostaje sama treść tekstowa + sanitizer usuwa script/style i atrybuty zdarzeń; tryb Allow: HTML przepuszczony w całości — wyłącznie dla zaufanego wejścia

Bezpieczeństwo podglądu: wynik jest na stronie zawsze pokazywany jako kod (escapowany), więc nawet wklejony <script> w trybie Allow niczego nie uruchomi na tej stronie. Uwaga przy pobieraniu: plik konwersja.html z trybu Allow zawiera surowy HTML — otwieraj go tylko wtedy, gdy ufasz treści wejściowej.

Warto wiedzieć — Markdown i HTML w praktyce

Safe czy Allow?

Safe (domyślny) zdejmuje znaczniki HTML z wejścia i dokłada sanitizer — do treści publicznych i komentarzy. Allow przepuszcza HTML w całości: ma sens wyłącznie przy zaufanym wejściu, np. konwersji własnych notatek. W razie wątpliwości zostaw Safe.

Tabele GFM — dlaczego nie przechodzą

Silnik używa rdzenia CommonMark bez rozszerzenia GitHub Flavored Markdown, więc zapis z pionowych kresek zostaje zwykłym tekstem. Jeśli potrzebujesz tabel w HTML, rozłóż je osobno (np. w arkuszu kalkulacyjnym) albo użyj konwertera z włączonym GFM po swojej stronie.

HTML dłuższy od Markdown

Każde ** staje się <strong>…</strong>, każdy punkt listy dostaje własny <li> — stąd dodatni procent w kafelku „Zmiana rozmiaru” to norma. Jeśli HTML wychodzi dłuższy wielokrotnie, sprawdź, czy w tekście nie mnożą się puste linie tworzące osobne akapity.

Open new i linki wychodzące

Opcja „Open new” dodaje każdemu <a> bez własnego target atrybuty target=„_blank” oraz rel=„noopener noreferrer” — użytkownik nie traci strony, a dokument otwierający nie dostaje kontroli nad nową kartą. Dla treści CMS to domyślny, bezpieczny wybór.

Oceń to narzędzie:

Powiązane narzędzia

Inne narzędzia, które mogą Ci się przydać

Konwerter Markdown na HTML – online z podglądem na żywo

Markdown to lekki język znaczników pozwalający formatować tekst za pomocą prostych symboli (* dla bold, # dla nagłówków). Narzędzie konwertuje Markdown na HTML z podglądem na żywo i obsługuje standard CommonMark i GitHub Flavored Markdown (GFM).

konwerter Markdown HTML markdown na html online markdown preview GFM GitHub Markdown

Składnia Markdown – podstawy

Nagłówki: # H1, ## H2, ### H3. **Pogrubienie** lub __pogrubienie__. *Kursywa* lub _kursywa_. ~~Przekreślenie~~. [Link](URL). ![Obraz](URL "alt"). Lista nieuporządkowana: - lub * lub +. Numerowana: 1. 2. 3. Kod inline: `kod`. Blok kodu: 3× backtick. > Cytat. --- Linia pozioma.

GitHub Flavored Markdown (GFM)

Tabele: | Kolumna | | --- | | Wartość |. Checkboxy: - [x] zrobione, - [ ] do zrobienia. Strikethrough: ~~tekst~~. Autolink: https:// automatycznie linkuje. Syntax highlighting: ```javascript kod ```. @mentions i #issues (na GitHub). Task lists: interaktywne checkboxy. Emoji: :smile: :rocket:.

Markdown w różnych aplikacjach

GitHub/GitLab: README.md, wiki. Notion: natywne Markdown. Obsidian: Markdown first note-taking. Jekyll/Hugo: static site generators (Markdown → HTML). VS Code: Markdown preview wbudowany. Discord: częściowy Markdown (bold, italic, code, spoiler). Reddit: podobny ale własna składnia. Mattermost/Rocket.Chat: pełny Markdown.

CommonMark vs GFM vs MultiMarkdown

CommonMark: standaryzacja podstawowego Markdown (2014). spec.commonmark.org. Dingus: live parser. GFM: GitHub rozszerzenie (tabele, checkboxy, strikethrough). MultiMarkdown: rozszerzony (tabele, przypisy, metadata). Pandoc: konwerter universal (md, rst, docx, PDF). Każdy system może interpretować Markdown trochę inaczej.

Jak działa konwersja Markdown na HTML

Konwersja przebiega w dwóch etapach. Najpierw parser blokowy czyta dokument linia po linii i grupuje go w bloki: nagłówki, akapity, listy, cytaty, bloki kodu, tabele i linie poziome. O tym, czym jest dany blok, decyduje początek linii oraz kontekst — na przykład wcięcie czterech spacji po akapicie oznacza blok kodu, a to samo wcięcie wewnątrz listy oznacza zagnieżdżoną treść elementu. Pusta linia rozdziela bloki, dlatego jej brak potrafi scalić dwa elementy w jeden akapit.

Drugi etap to parsowanie wewnątrzblokowe. Parser przeszukuje treść akapitu, nagłówka czy elementu listy i zamienia znaczniki inline na odpowiadające im znaczniki HTML: pogrubienie, kursywę, kod, linki, obrazy. Kolejność i zasięg tych znaczników nie są dopasowywane prostym wyrażeniem regularnym — obowiązują reguły tzw. flankingu, które określają, czy dany znak może otwierać lub zamykać wyróżnienie. Dzięki temu gwiazdka w środku wyrazu nie zawsze staje się kursywą, a podkreślniki w nazwie funkcji nie rozbijają tekstu.

Na końcu drzewo elementów zostaje zserializowane do łańcucha HTML. W tym momencie znaki specjalne wewnątrz kodu i tekstu są zamieniane na encje, a surowy HTML obecny w źródle jest przepuszczany lub usuwany — zależnie od ustawień parsera. Wynik jest tylko strukturą semantyczną: żadne style, klasy czy skrypty nie są dopisywane, więc o wyglądzie decyduje arkusz CSS po stronie docelowej. Konwersja jest też praktycznie nieodwracalna w szczegółach — powrót z HTML do Markdown nie odtworzy oryginalnych łamanych linii i odstępów.

Przykład krok po kroku: fragment pliku .md

Wklej do pola wejściowego fragment dokumentu: linia ## Instalacja, po niej lista numerowana z dwoma punktami, gdzie drugi zawiera pogrubienie i kod inline.
Parser blokowy rozpoznaje pierwszą linię jako nagłówek drugiego poziomu, bo zaczyna się od dwóch znaków hash i spacji. Kolejne linie zaczynające się od cyfry i kropki tworzą jeden blok listy numerowanej.
Parsowanie wewnątrzblokowe zamienia **Uruchom** na znacznik pogrubienia, a tekst w odwrotnych apostrofach na znacznik kodu. Reszta treści pozostaje zwykłym tekstem.
Generator składa wynik: nagłówek w znaczniku h2, a pod nim lista uporządkowana, w której drugi element zawiera pogrubiony wyraz i fragment kodu zamiast odwrotnych apostrofów.
Podgląd na żywo pokazuje sformatowany dokument, a zakładka z kodem źródłowym — surowy HTML gotowy do wklejenia.
Skopiuj wynik i wstaw go do szablonu strony. Jeżeli dokument ma być osadzony w całości, pamiętaj o znacznikach html, head i body, których konwerter nie dodaje.

Mapowanie składni na znaczniki HTML

Element	Składnia Markdown	Wynikowy HTML
Nagłówek	# Tekst	<h1>Tekst</h1>
Pogrubienie	Tekst	<strong>Tekst</strong>
Kursywa	Tekst	<em>Tekst</em>
Przekreślenie	~~Tekst~~	<del>Tekst</del>
Link	[opis](adres)	<a href="adres">opis</a>
Kod inline	`kod`	<code>kod</code>
Blok kodu	trzy odwrotne apostrofy	<pre><code>...</code></pre>
Cytat	> tekst	<blockquote><p>tekst</p></blockquote>

Praktyczne wskazówki

Zostaw pustą linię przed listą i tabelą — bez niej parser potraktuje znaczniki listy jako zwykły tekst w akapicie i wynik będzie inny, niż zakładasz.
Pilnuj wcięć w zagnieżdżonych listach — podlista musi być wcięta o tę samą liczbę spacji co treść elementu nadrzędnego, inaczej wypadnie poza listę.
Podawaj język w bloku kodu — wpis po trzech odwrotnych apostrofach pozwala docelowemu rendererowi włączyć podświetlanie składni; sam konwerter tylko przenosi tę informację do klasy.
Traktuj surowy HTML ostrożnie — jeśli wklejasz cudzy Markdown, wynik może zawierać znaczniki, których się nie spodziewasz. Przejrzyj kod przed publikacją.
Sprawdź wynik na docelowym rendererze — podgląd w narzędziu to jedna implementacja; GitHub, GitLab i generator stron statycznych mogą inaczej potraktować graniczne przypadki.

Czego konwersja nie uwzględnia

Surowy HTML w źródle — znaczniki wklejone wprost do dokumentu Markdown przechodzą do wyniku bez zmian, więc to nie jest filtr bezpieczeństwa i nie oczyści treści z niechcianych elementów.
Warstwa prezentacji — wynik to znaczniki semantyczne bez klas i stylów. Tabele, cytaty i bloki kodu wyglądają domyślnie i wymagają własnego CSS.
Rozszerzenia spoza obsługiwanych dialektów — przypisy, definicje, metadane dokumentu, wzory matematyczne czy bloki front matter z MultiMarkdown i Pandoca nie zostaną rozpoznane i trafią do wyniku jako zwykły tekst.
Konwersja typograficzna — narzędzie nie zamienia prostych cudzysłowów na typograficzne ani trzech kropek na wielokropek, bo nie ma takiej reguły w specyfikacji; takie zmiany trzeba wprowadzić ręcznie lub osobnym skryptem.

Najczęstsze pytania

Jak konwertować Markdown na HTML w Node.js?

npm install marked. const { marked } = require("marked"); const html = marked.parse("# Hello\n**bold**"). Alternatywy: remark (unist/mdast), markdown-it (szybszy), showdown. Zabezpieczenie XSS: marked.setOptions({ sanitize: true }) lub użyj DOMPurify na output.

Jak konwertować Markdown na HTML w Python?

pip install markdown. import markdown; html = markdown.markdown(text). Extensions: markdown.markdown(text, extensions=["tables","fenced_code","toc"]). Mistune: szybsza biblioteka. Pandoc: subprocess call do pandoc CLI (konwersja do PDF, docx też). Jekkyll/MkDocs: automatyczna konwersja przy budowaniu.

Jak edytować Markdown z podglądem?

VS Code: wbudowany Ctrl+Shift+V (preview obok). Typora: WYSIWYG Markdown editor. Obsidian: notes z live preview. HackMD / HedgeDoc: kolaboratywne online. Notion: zaimportuj Markdown. Dillinger.io: online. StackEdit.io: online, sync z Google Drive.

Co to jest front matter w Markdown?

YAML front matter: metadata na początku pliku Markdown. --- \n title: "Tytuł" \n date: 2024-01-01 \n --- Używany w: Jekyll, Hugo, Gatsby, Astro, Obsidian. Zawiera: title, author, date, tags, categories, featured_image. Biblioteki: gray-matter (npm) parsuje front matter.

Jak obsługiwać matematykę w Markdown?

LaTeX math: $formuła$ (inline) i $$formuła$$ (block). KaTeX: lekka, fast math renderer. MathJax: pełny LaTeX support, cięższy. GitHub: obsługuje $...$ i $$...$$ od 2022. Obsidian: wbudowany MathJax. Jupyter Notebooks: pełny LaTeX.

Czy wynikowy HTML mogę wkleić bezpośrednio na stronę?

Tak, to fragment kodu do osadzenia w istniejącym szablonie. Konwerter nie dodaje znaczników html, head ani body, więc wklejasz go w miejsce, w którym ma się pojawić treść.

Dlaczego mój dokument wygląda inaczej po wklejeniu na GitHubie?

GitHub używa własnej implementacji z rozszerzeniami GFM, a Twoja strona może renderować znaczniki innym parserem lub bez arkusza stylów. Różnice dotyczą zwykle tabel, zadań i sposobu traktowania surowego HTML.

Czy konwerter obsługuje tabele i listy zadań?

Tak, tabele i checkboxy w stylu GFM są rozpoznawane i zamieniane na znaczniki table oraz pola wyboru. Interaktywność tych pól zależy od tego, czy docelowa strona pozwala na ich użycie.

Czy mogę przetworzyć cały plik .md naraz?

Tak, wystarczy wkleić całą zawartość pliku do pola wejściowego — rozmiar dokumentu ma znaczenie tylko dla wygody pracy w przeglądarce. Konwersja odbywa się lokalnie na tekście, który wkleisz.

Czy narzędzie doda style, żeby HTML wyglądał dobrze od razu?

Nie. Otrzymujesz czysty kod strukturalny, a wygląd zależy od CSS Twojej strony. To zaleta przy osadzaniu w istniejącym szablonie, ale wymaga odrobiny pracy, jeśli budujesz stronę od zera.

Powiązane narzedzia: formatowanie HTML, konwerter HTML na tekst i walidator Markdown.