acento.io
Tekst-tool

Markdown-voorbeeld

Render GitHub-flavored Markdown live naar HTML — volledig in je browser, zonder dat er ook maar één teken jouw apparaat verlaat.

Door Carlos Suárez , Systeemingenieur
Laatst bijgewerkt:

Wat deze Markdown-voorbeeld doet

Deze Nederlandstalige Markdown-renderer zet GitHub-flavored Markdown (GFM) direct om naar HTML terwijl je typt — geen installatie, geen extensie zoals de populaire VSCode markdown preview nodig. Je ziet meteen het resultaat in een split-view editor, schakelt over naar een schone voorbeeldweergave of bekijkt de ruwe HTML-uitvoer. Tabellen, omheinde codeblokken, doorhalen en takenlijsten worden allemaal correct verwerkt. Het resultaat download je als een compleet .html-bestand, klaar voor distributie. 100% client-side — jouw gegevens verlaten nooit je browser. Geen uploads, geen tracking, geen serverlogs. Dat maakt dit gereedschap bijzonder geschikt voor vertrouwelijke concepten, NDA-documenten of interne notities. Het Genootschap Onze Taal rapporteerde in 2023 dat ruim 25 miljoen mensen wereldwijd Nederlands als moedertaal spreken; ook voor hen geldt dat privacybewust schrijven begint bij de juiste tools.

Functies

  • Live split-view editor. Schrijf links, zie rechts het resultaat — zonder vertraging. Ideaal als markdown live preview tijdens het opstellen van een README of blogpost.
  • Dedicated preview-modus. Verberg de editor en bekijk alleen het gerenderde document. Handig om een definitieve opmaakcontrole te doen voordat je exporteert.
  • Ruwe HTML-weergave. Schakel naar de HTML-tab en kopieer de gegenereerde markup rechtstreeks naar je CMS, e-mailtemplate of statische sitegenerator.
  • Downloaden als volledig .html-bestand. Met één klik sla je een op zichzelf staand HTML-bestand op, inclusief basisopmaak — direct deelbaar zonder extra tooling.
  • GitHub-flavored Markdown. Tabellen, takenlijsten (- [ ]), strikethrough (~~tekst~~) en omheinde codeblokken met taalmarkering worden allemaal ondersteund conform de GFM-specificatie. Voor het converteren van speciale tekens in je output kun je ook de [HTML entity encoder/decoder](/nl/html-entities/) gebruiken.
  • Geen installatie, geen afhankelijkheden. Werkt in elke moderne browser. Er is geen plugin zoals een VSCode markdown viewer of Sublime Text markdown preview nodig — open de pagina en begin meteen.

Zo gebruik je de Markdown-voorbeeld

Plak of typ je Markdown in het editorvenster en het resultaat verschijnt direct aan de rechterkant.

  1. Typ of plak je Markdown. Gebruik de linkerkolom als invoer. Probeer bijvoorbeeld een tabel: | Kop 1 | Kop 2 |\n|---|---|\n| cel | cel |.
  2. Kies je weergavemodus. Klik op **Split** voor editor + preview naast elkaar, **Preview** voor alleen het gerenderde resultaat, of **HTML** om de gegenereerde broncode te inspecteren.
  3. Controleer de opmaak. Gebruik de preview als markdown test om te zien of tabellen, koppen en codeblokken correct worden weergegeven vóór publicatie.
  4. Download of kopieer. Klik op **Download .html** voor een volledig bestand, of selecteer en kopieer de HTML rechtstreeks vanuit de HTML-tab naar jouw project.

Veelvoorkomende toepassingen

  • README-bestanden controleren. Bekijk hoe een GitHub README eruitziet vóórdat je commit, zonder de markdown preview vscode-extensie te hoeven openen of naar GitHub te pushen.
  • Blogposts schrijven voor statische sitegenerators. Auteurs die schrijven voor Hugo, Jekyll of Astro kunnen hun Markdown-concepten live renderen en direct een HTML-versie exporteren voor staging.
  • Vertrouwelijke documenten opstellen. Juridische teams en ontwikkelaars die aan NDA's of interne specificaties werken, kunnen Markdown formatteren zonder dat de tekst een server bereikt.
  • Markdown aanleren. Studenten en nieuwe teamleden zien direct het effect van elke syntaxwijziging — een effectieve manier om GFM te leren. Als je ook tekstverschillen wilt bijhouden, biedt de [text diff](/nl/text-diff/) daarvoor uitkomst.
  • HTML genereren voor e-maildistributie. Schrijf nieuwsbrieven of documentatie in Markdown en download het resultaat als .html om te importeren in je e-mailclient of intern portaal.

Veelgestelde vragen

Wordt mijn tekst opgeslagen of verstuurd naar een server?

Nee. De volledige rendering vindt plaats in jouw browser via JavaScript. Er worden geen gegevens verstuurd, opgeslagen of gelogd — ook niet bij het downloaden van het .html-bestand. Dit geldt ook voor gevoelige documenten zoals contracten of interne specificaties.

Wat is het verschil tussen CommonMark en GitHub-flavored Markdown?

CommonMark is de basisstandaard voor Markdown-parsing. GitHub-flavored Markdown (GFM) voegt extensies toe zoals tabellen, takenlijsten en strikethrough die niet in de originele spec van John Gruber staan. Deze tool volgt GFM, zodat README-bestanden er correct uitzien. Merk op dat YAML frontmatter en Mermaid-diagrammen buiten scope vallen — die vereisen extra bibliotheken.

Kan ik HTML-tags mengen met mijn Markdown?

Ja, maar wees voorzichtig: parsers verschillen in hoe ze ingesloten HTML behandelen. GFM staat inline HTML toe, maar sommige tags worden om veiligheidsredenen gestript. Test het resultaat altijd via de HTML-tab voordat je publiceert.

Waarom is er geen syntaxkleuring in codeblokken?

Bewust wegggelaten. Syntaxkleuring vereist een bibliotheek zoals highlight.js of Prism, wat het bundelgewicht aanzienlijk vergroot. Deze tool houdt de bundle klein en laadt daardoor razendsnel, ook op langzame verbindingen.

Werkt dit als alternatief voor de VSCode markdown preview?

Voor snelle controles en het exporteren naar HTML: ja. De VSCode markdown preview is beter geïntegreerd met je bestandssysteem en extensies, maar vereist een lokale installatie. Deze tool werkt direct in de browser — handig op een vreemde computer of in een CI-omgeving. Zie ook de MDN — JSON.parse documentatie als je JSON-data in je Markdown-workflow verwerkt.

Zijn er beperkingen bij het downloaden van het .html-bestand?

Het gedownloade bestand bevat de gerenderde HTML met basisopmaak. Het bevat geen externe afbeeldingen of assets die je in de Markdown hebt verwezen — die paden blijven relatief. Controleer dit zoals ECMA-404 JSON doet voor dataformaten: de structuur klopt, maar inhoud buiten scope moet je zelf beheren.