Een screenshot van code maken voor presentaties of posts
Plak je code, kies de taal en een frame voor macOS of Windows en download een scherpe PNG voor presentaties, documenten of posts op sociale media.
3 min leestijd
Open de code-screenshotgenerator en plak je code in het venster om een screenshot van je code te maken. Kies de taal bij "Taal", zodat de kleuren bij de code passen. Typ een naam bij "Bestandsnaam" voor de titelbalk en klik vervolgens op "PNG". De afbeelding wordt in je browser gemaakt.
Een screenshot van je editor toont ook tabbladen, menu's en kleine tekst. Hier krijg je alleen het venster met je code, op drie keer de schermgrootte. De tekst blijft scherp op een grote slide.
Zo maak je de afbeelding
- Klik in het venster en plak je code. Je kunt er ook typen. Met Enter behoud je de inspringing van de regel erboven.
- Kies de taal bij "Taal". JavaScript is de standaardinstelling.
- Kies een frame bij "Vensterstijl": macOS, Windows of Geen. macOS is de standaardinstelling.
- Typ een bestandsnaam, zoals
retry.py. Die wordt weergegeven in de titelbalk. - Klik onder het voorbeeld op "PNG".
Code-screenshotgenerator met de Python-functie die opnieuw probeert in de editor, Python geselecteerd als taal en retry.py ingevuld als bestandsnaam
Het bestand wordt opgeslagen als snippet, gevolgd door een nummer, bijvoorbeeld snippet-1792757286543.png. Klik op "Voorbeeld invoegen" om eerst een kort JavaScript-voorbeeld te bekijken.
Welke talen je kunt kiezen
De lijst 'Taal' bevat 25 opties.
- Web: JavaScript, TypeScript, HTML en CSS.
- Programmeren: Python, Java, Rust, C++, C, Go, PHP, SQL en Shell.
- Data en configuratie: JSON, JSON5, XML, YAML, CSV, INI, TOON, Nginx en Prisma Schema.
- Tekst: Markdown, LaTeX en Platte tekst.
De taal bepaalt alleen de kleuren. Die wordt niet automatisch afgeleid van de code of de bestandsnaam, dus kies de taal zelf.
De kleuren aanpassen
De codekleuren volgen het thema van de site. Open voor een donkere afbeelding het menu bovenaan de pagina, klik op de themaknop en kies "Donker thema". Kies "Licht thema" voor een witte afbeelding.
De titelbalk blijft in beide thema's donker totdat je "Kleur titelbalk" wijzigt. De titeltekst wordt wit of zwart, afhankelijk van wat het best leesbaar is. Als "Vensterstijl" op Geen staat, is er geen titelbalk en is het kleurveld uitgeschakeld.
Het lettertype en de opvulling liggen vast. De afbeelding heeft geen regelnummers.
De breedte instellen
Het venster is zo breed als de langste regel. Sleep de kleine gestippelde greep rechtsonder om het venster smaller of breder te maken. Lange regels lopen dan door op de volgende regel. Het venster is minstens 300 pixels breed en de greep komt niet op de afbeelding.
Een heel lange regel kan ervoor zorgen dat het venster buiten het voorbeeld valt. Klik op de knop Opnieuw instellen in de balk boven het voorbeeld om het venster weer passend te maken. De zoomknoppen veranderen alleen het voorbeeld, niet de download.
Welk formaat je kiest
- PNG houdt het gebied buiten de afgeronde hoeken transparant, zodat de afbeelding op een slide met elke kleur past.
- JPG vult die kleine hoeken met zwart.
- Afdrukken opent de afbeelding in een nieuw venster met het afdrukvenster.
Beide formaten zijn drie keer zo groot als het venster op het scherm. Een venster van 752 pixels breed geeft bijvoorbeeld een afbeelding van 2256 pixels breed.
Plak de code, kies de taal en download de PNG voor je slide.
Klaar om het zelf te proberen?
Code-screenshotgenerator
Genereer een screenshot van code‑fragmenten met syntaxis‑highlighting.