Aufgabenpfad / von der Eingabe zum Ergebnis
So verwandelst du Code in ein teilbares Bild
- 01
Füge deinen Code ein
Tippe oder füge in das Feld Code-Quelle ein — bis zu 65.536 UTF-8-Bytes, höchstens 200 Zeilen und 240 Zeichen pro Zeile. Der Zähler neben dem Label zeigt die aktuelle Bytezahl im Verhältnis zum Limit, und alles jenseits einer Grenze wird mit einer Meldung abgelehnt, die sie nennt, damit du genau weißt, was du kürzen musst.
- 02
Wähle Sprache und Theme
Wähle JavaScript, TypeScript, HTML, CSS, JSON oder Bash unter Sprache, dann setze Theme auf Hell oder Dunkel. Die Syntaxfarben kommen aus der passenden Shiki-Grammatik und einem Theme im GitHub-Stil, und Beispiel laden füllt das Feld mit einem kurzen Beispiel in der gewählten Sprache, damit du Looks vergleichen kannst, bevor du deinen eigenen einfügst.
- 03
Style den Rahmen
Lege die Hintergrundfarbe, Innenabstand von 16 bis 96 px und Schriftgröße von 12 bis 28 px fest, füge dann einen Fenstertitel von bis zu 80 Zeichen hinzu, schalte Zeilennummern anzeigen um und wähle eine Export-Skalierung von 1x oder 2x. Die Zeilenhöhe folgt automatisch der Schriftgröße, größere Schrift bleibt also ohne Extra-Feintuning lesbar.
- 04
Generiere die Vorschau
Generieren lädt den lokalen Tokenizer, misst die tatsächlichen Schriftläufe und den Fenstertitel und zeigt dasselbe escaped SVG, das für den Export verwendet wird. Code bleibt inerter Text. Bearbeitungen leeren die alte Vorschau. Übergroße oder nicht messbare Ausgaben werden abgelehnt; breite Vorschauen lassen sich mit der Tastatur scrollen.
- 05
Lade das SVG oder PNG herunter
Nutze SVG herunterladen für die skalierbare Vektordatei oder PNG herunterladen für eine Bitmap, die über Canvas in der gewählten Skalierung gerendert wird. Beide Dateien werden lokal erzeugt, und wenn die gewählte Kombination die sichere Exportgröße überschreiten würde, sagt der Arbeitsbereich das, statt eine korrupte Datei zu schreiben.