Screenshots of code age badly
A photo of your terminal loses fidelity the moment it is compressed for a chat app. Lines blur, colors wash out, and nobody can copy the code. Rendering the snippet as a card keeps it sharp at any size.
Pick the template by context
- Midnight — dark background, highest contrast for syntax highlighting. Best for sharing on dark-mode feeds.
- Tech Blue — cool, corporate, reads well in docs and Slack.
- Classic — clean light card, safe default for almost anything.
Keep it short
A card is not a file. Show the part that matters:
function toCard(markdown: string) {
return render(markdown) // parsed locally, never uploaded
}
Long files should be split across several cards with --- between them, so each slide shows one coherent block.
Export at the right scale
Use 2× for screens and 3× if the card will appear in a slide deck or print. Copy the image to the clipboard and paste it wherever code goes.