explaingit

carbon-app/carbon

36,023JavaScriptAudience · vibe coderComplexity · 2/5MaintainedLicenseSetup · easy

TLDR

Web app that transforms code snippets into beautiful, shareable images with customizable themes, syntax highlighting, and styling.

Mindmap

mindmap
  root((Carbon))
    What it does
      Convert code to images
      Customize themes
      Share snippets
    How to use
      Paste code
      Import from file
      Add GitHub Gist
    Export options
      PNG or SVG
      Copy to clipboard
      Share link
    Features
      Editor plugins
      Offline PWA
      Auto-unfurl preview
    Customization
      Syntax highlighting
      Background color
      Window style
      Font and padding

Things people build with this

USE CASE 1

Create polished code screenshots for blog posts, tutorials, and documentation.

USE CASE 2

Generate visually appealing code images for social media posts and tweets.

USE CASE 3

Share code snippets with auto-preview on Twitter, Slack, and other platforms.

USE CASE 4

Quickly style code for presentations and talks without manual design work.

Tech stack

JavaScriptNext.jsReactPWA

Getting it running

Difficulty · easy Time to first run · 5min
Use freely for any purpose, including commercial use, as long as you keep the copyright notice.

In plain English

Carbon is a web application that lets you turn a snippet of code into a beautiful, shareable image. If you have ever seen a screenshot of code on social media with a styled background, window chrome, and syntax highlighting, it was likely created with a tool like Carbon. The problem it solves is that plain screenshots of code editors look inconsistent and often lack visual polish, whereas Carbon produces clean, customizable images that look intentional and professional. Using Carbon is straightforward: you paste your code into the editor on the website, or import it by dropping a file or appending a GitHub Gist ID to the URL. From there you can customize the syntax highlighting theme, background color, window style, font, padding, and shadow. When you are happy, you export the image as a PNG or SVG, copy it directly to your clipboard, or share a link to a saved snippet. Saved snippets are particularly useful because they auto-unfurl on platforms like Twitter and Slack, showing the image preview while also giving viewers access to the original code through the link. The project also provides plugins for popular code editors including VS Code, Vim, Emacs, Atom, Sublime Text, and IntelliJ, so you can open a code selection in Carbon directly from your editor. Someone would use Carbon when writing a blog post, tutorial, tweet, or presentation where they want to show code in a visually appealing way. The project is built with JavaScript using the Next.js framework, runs as a progressive web app so it can be installed for offline use, and is hosted at carbon.now.sh.

Copy-paste prompts

Prompt 1
How do I set up the Carbon editor plugins for VS Code to export code snippets directly?
Prompt 2
Show me how to customize the syntax highlighting theme and background color in Carbon.
Prompt 3
How can I save and share a code snippet in Carbon so it auto-unfurls on Twitter?
Prompt 4
What are the steps to import code from a GitHub Gist into Carbon and export it as an image?
Prompt 5
How do I use Carbon offline as a progressive web app on my computer?
Open on GitHub → Explain another repo

Generated 2026-05-18 · Model: sonnet-4-6 · Verify against the repo before relying on details.