Image Splitter
Stand
Uitvoerformaat
Breedte
Schaal
Transparant
Sjablonen
Je kunt afbeeldingsadressen toevoegen, bijvoorbeeld: <img src="https://images.unsplash.com/photo-1500530855697-b586d89ba3ee?auto=format&fit=crop&w=1600&q=80" />
Voorbeeld

HTML naar afbeelding

Zet HTML en CSS om naar een afbeelding

Zo werkt het

1

Voorbereiden

Voer tekst in of open de HTML- of Markdown-editor.

2

Instellen en controleren

Pas de opmaak aan, controleer de voorvertoning en sla de afbeelding op.

Praktijkvoorbeelden

HTML naar afbeelding · Voorbeeld 1

Deze bestanden zijn verwerkt met deze tool of dezelfde verwerkingscode. Vergelijk de bronbestanden, instellingen en downloadbare resultaten.

Voorbeeld 1
PNG1000 × 640 px

Invoer2

<section><small>01 / 03</small><h1>2026</h1><p>09 / 22</p></section>
*{box-sizing:border-box} body{margin:0} section{padding:56px;background:#153d36;color:#f7e3b6;min-height:320px;font-family:system-ui;border-radius:20px} small{letter-spacing:4px;font-size:16px} h1{font-size:72px;line-height:1.1;margin:30px 0} p{font-size:22px}
Bronbestanden (2)

ResultaatPNG

HTML naar afbeelding — Voorbeeld 1 — Resultaat
Downloaden 1PNG
Praktijkvoorbeelden

HTML naar afbeelding · Meer voorbeelden

Deze bestanden zijn verwerkt met deze tool of dezelfde verwerkingscode. Vergelijk de bronbestanden, instellingen en downloadbare resultaten.

Voorbeeld 2
PNG1000 × 640 px

Invoer2

<section><small>02 / 03</small><h1>12:30</h1><p>09 / 22 · 2026</p></section>
*{box-sizing:border-box} body{margin:0} section{padding:56px;background:#f5e6d8;color:#673f2f;min-height:320px;font-family:system-ui;border-radius:20px} small{letter-spacing:4px;font-size:16px} h1{font-size:72px;line-height:1.1;margin:30px 0} p{font-size:22px}
Bronbestanden (2)

ResultaatPNG

HTML naar afbeelding — Voorbeeld 2 — Resultaat
Downloaden 1PNG
Voorbeeld 3
PNG1000 × 640 px

Invoer2

<section><small>03 / 03</small><h1>01 → 02</h1><p>12 + 24 = 36</p></section>
*{box-sizing:border-box} body{margin:0} section{padding:56px;background:#e4eef4;color:#214762;min-height:320px;font-family:system-ui;border-radius:20px} small{letter-spacing:4px;font-size:16px} h1{font-size:72px;line-height:1.1;margin:30px 0} p{font-size:22px}
Bronbestanden (2)

ResultaatPNG

HTML naar afbeelding — Voorbeeld 3 — Resultaat
Downloaden 1PNG

Veelgestelde vragen

Nee. De tool zet tekst, HTML of Markdown om in een opgemaakte afbeelding. Je eigen inhoud en opmaak bepalen het resultaat.

Gerelateerde tools

Afbeelding naar PDF

Maak één PDF van meerdere afbeeldingen. Sleep ze in de juiste volgorde en stel de marges in.

Openen

Afbeelding comprimeren

Verklein een afbeeldingsbestand door formaat en kwaliteit aan te passen. De besparing en het detailverlies hangen af van het origineel.

Openen

Formaat wijzigen

Wijzig de breedte en hoogte van een afbeelding. Behoud de verhouding om vervorming te voorkomen; vergroten herstelt geen ontbrekende details.

Openen