DEV Community

Cover image for 6 Tools to Create Elegant Code Screenshots for Your Social Networks
Gaël Thomas for FlyCode org

Posted on • Originally published at blog.flycode.com

6 Tools to Create Elegant Code Screenshots for Your Social Networks

Discover different tools to create code screenshots. All of them are free and available online or on VSCode.

After reading this article, you'll have no excuse for not creating content on your favorite social network! 😉

4 online tools to convert your code to image

The below tools allow you a set of customization functionalities to make your code snippets shine. We gathered a picture of their interface and an example of the output for each of them.

We let you play with the different configurations and find the one matching your needs the best.

Snappify - Create beautiful code snippets with ease

➡️ Open Snappify

Snappify editor overview

Snappify code screenshot output

Showcode - Create beautiful images of code.

➡️ Open Showcode

Showcode editor overview

Showcode code screenshot output

Carbon - Create and share beautiful images of your source code

➡️ Open Carbon

Carbon editor overview

Carbon code screenshot output

Ray - Create beautiful images of your code

➡️ Open Ray

Ray editor overview

Ray code screenshot output

2 VSCode extensions to generate code screenshots

If you like to stay in your code editor, these two extensions are for you.
They will allow you to highlight the code of your choice and generate a screenshot of it.

Polacode - Polaroid for your code

➡️ Download Polacode on VSCode

Polacode overview

Polacode code screenshot output

CodeSnap - Take beautiful screenshots of your code

➡️ Download CodeSnap on VSCode

CodeSnap overview

CodeSnap code screenshot output

Do you know any others?

We hope you find this article helpful! If you know some other tools, let us know on Twitter.

If you want to discover a brand new tool to manage your product translations outside of your code ➡️ visit our website.

Top comments (5)

Collapse
 
smhdasadi profile image
Seyed Mohammad Asadi

Thanks for your great post. I really like the CodeSnap. it makes taking screenshots a breeze in VSCode.

Collapse
 
joshistoast profile image
Josh Corbett

People need to stop posting about Polacode, it doesn't work with newer versions of VS Code and hasn't for over 2 years. It baffles me people still recommend it. Good list aside from that though.

Collapse
 
gaelgthomas profile image
Gaël Thomas

Hello @joshwcorbett, glad to know you like the list!

When I wrote this article, I tested all tools to create the demonstration image, and Polacode worked in my VSCode (last version). Did I miss some cases where it's not working?

Collapse
 
codereverend profile image
the antisocial socialist

Why screenshot code?

Collapse
 
gaelgthomas profile image
Gaël Thomas

That's a good question! For developers active on social platforms like Twitter or actively blogging, it can be an excellent way to share code.
On Twitter, I saw a lot of creators using code screenshots; that's why I decided to compile some of them here. 😁