Så tar du en skärmbild av kod till presentationer eller inlägg

Öppna verktyget för kodskärmbilder och klistra in koden i fönstret för att ta en skärmbild av den. Välj språk under "Språk" så att färgerna passar koden. Skriv ett namn i "Filnamn" för namnlisten och klicka sedan på "PNG". Bilden skapas i webbläsaren.

En skärmbild av din kodredigerare visar också flikar, menyer och liten text. Här får du bara fönstret med koden, i tre gånger så stor storlek som på skärmen. Texten förblir skarp på en stor presentationsbild.

Så skapar du bilden

1. Klicka i fönstret och klistra in koden. Du kan också skriva där. Enter behåller indraget från raden ovanför.
2. Välj språk under "Språk". JavaScript är förvalt.
3. Välj en ram under "Fönsterstil": macOS, Windows eller Ingen. macOS är förvalt.
4. Skriv ett filnamn, till exempel retry.py. Det visas i namnlisten.
5. Klicka på "PNG" under förhandsvisningen.

Verktyget för kodskärmbilder med Python-funktionen för omförsök i redigeraren, Python valt som språk och retry.py angivet som filnamn

Filen sparas som snippet följt av ett nummer, till exempel snippet-1792757286543.png. Klicka på "Infoga exempel" för att först se ett kort JavaScript-exempel.

Språk du kan välja

Listan "Språk" innehåller 25 alternativ.

• Webb: JavaScript, TypeScript, HTML och CSS.
• Programmering: Python, Java, Rust, C++, C, Go, PHP, SQL och Shell.
• Data och konfiguration: JSON, JSON5, XML, YAML, CSV, INI, TOON, Nginx och Prisma Schema.
• Text: Markdown, LaTeX och ren text.

Språket styr bara färgerna. Det hämtas inte från koden eller filnamnet, så välj det själv.

Så ändrar du färgerna

Kodens färger följer webbplatsens tema. Om du vill ha en mörk bild öppnar du menyn högst upp på sidan, klickar på temaknappen och väljer "Mörkt tema". Om du vill ha en vit bild väljer du "Ljust tema".

Namnlisten förblir mörk i båda temana tills du ändrar "Färg på namnlisten". Texten i namnet blir vit eller svart, beroende på vilket som är lättast att läsa. Om "Fönsterstil" är inställt på Ingen finns ingen namnlist, och färgfältet är inaktivt.

Typsnittet och utfyllnaden är fasta. Bilden har inga radnummer.

Så ställer du in bredden

Fönstret är lika brett som den längsta raden. Dra i det lilla prickade handtaget i det nedre högra hörnet för att göra det smalare eller bredare. Långa rader bryts då till nästa rad. Fönstret är minst 300 pixlar brett, och handtaget syns inte i bilden.

En mycket lång rad kan göra att fönstret hamnar utanför förhandsvisningen. Klicka på knappen Återställ i fältet ovanför förhandsvisningen för att anpassa det igen. Zoomknapparna ändrar bara förhandsvisningen, inte den nedladdade bilden.

Vilket format ska du välja?

• PNG behåller området utanför de rundade hörnen genomskinligt, så att bilden passar på en presentationsbild med valfri färg.
• JPG fyller de små hörnen med svart.
• Skriv ut öppnar bilden i ett nytt fönster med utskriftsdialogrutan.

Båda formaten är tre gånger så stora som fönstret på skärmen. Ett fönster som är 752 pixlar brett ger till exempel en bild som är 2256 pixlar bred.

Klistra in koden, välj språk och ladda ner PNG-bilden till presentationen.