Code naar SVG-afbeelding
Zet een codefragment om in een afbeelding met syntaxmarkering, vensterframe en kleurverloop.
Code naar SVG-afbeelding
Plak een codefragment, selecteer de programmeertaal en deze tool converteert het naar een syntaxgemarkeerde afbeelding in een afgerond vensterframe — precies het soort code-screenshot dat je in een blog, tweet, presentatie of interne documentatie wilt delen. Trefwoorden, strings, commentaren en nummers worden automatisch gekleurd, en het venster krijgt optioneel een macOS-achtige titelbalk met gekleurde puntjes zodat het resultaat eruitziet als een echte editor, niet als gewone tekstuitvoer.
Het gereedschap ondersteunt negen programmeertalen — JavaScript, TypeScript, Python, JSON, HTML, CSS, Bash, SQL en platte tekst — elk met zijn eigen regels voor markering van trefwoorden, strings en commentaren. Kies een van zes kleurverloopaandachtsgebieden (zonsondergang, oceaan, middernacht, bos, druif of mono) en het gereedschap omwikkelt het venster met een passend kleurverloop. Pas de opvulling rond het venster aan, schakel de schaduweffecten in, stel de venstertitel in en zet regelnummers of de titelbalk onafhankelijk aan of uit. De tekengrootte schaalt de hele afbeelding, zodat zowel een korte eenregelige functie als een vijftig regels lange functie leesbaar blijft.
De uitvoer is een zelfstandig, resolutie-onafhankelijk SVG-document — scherp in elke grootte en eenvoudig rechtstreeks in een pagina of designtool in te sluiten. Regelaantal, tekencount en de uiteindelijke afbeeldingsgrootte in pixels worden live bijgewerkt onder de uitvoer terwijl je typt of opties wijzigt, zodat je precies ziet wat je gaat kopiëren of downloaden.
Alles gebeurt in je browser met behulp van een kleine ingebouwde highlighter — code wordt nergens geüpload en geen externe syntaxmarkeeringsservice ziet ooit wat je plakt. Dit maakt het veilig om te gebruiken op onuitgegeven functies, interne tools of iets anders dat je liever niet naar een externe server stuurt alleen om een mooie screenshot te maken.