Carbon – Create and share images of your source code | Hacker News Reader

Carbon – Create and share images of your source code

carbon.now.sh

117 pointspraveenscience39 comments

I love the appearance of it, but there are very few cases where sharing un-copyable blocks of code is actually what you want.

Let's say you're making a programming tutorial, or you're publishing an open source library and want to provide a website with code examples. Appearance is important, of course, but your audience will want to copy/paste your examples.

I feel like this should be a CSS generator for styling the <code> or <pre> tag. If you really want to have a built-in screenshot exporter as well, I suppose that's fine too!

I use it for presentations and have found it incredibly useful for that.

It's _really_ good for Twitter posts. Formatting is non-existent, so sharing an image is unfortunately the best way to do it in-feed. Links to Gists, etc are the best if you don't mind leaving Twitter for sure. That said, if images are a necessity, might as well make it look good with Carbon.

Or just link to pastebin/your-favorite-alternative where someone can view it while looking good + copyable? I get that it isn't "in-feed", but I think most people would prefer that over having to find some OCR software that likes this specific font and feed an image into it.

It's not either/or. You can use this to add an image to your post containing the link. Or a code-snippet website could use code like this to generate preview images to show up on Twitter.

How do you share code snippets on Twitter?

You upgrade to a platform that was made for sharing code snippets and not flinging insults and blogspam

I find it frustrating that you not only failed to answer the question to which you responded, but you also failed to provide the name of the alternative platform you so condescendingly espoused.

A disingenuous answer is still an answer. Just because it's trendy to abuse a medium like Twitter for all sorts of unintended purposes doesn't mean its good or right.

That’s not an answer though, that’s just unhelpful snark. I use Twitter because that's where my audience is. I don't have the social clout to move everyone somewhere else.

That's a good point! I don't use use Twitter, so that hadn't occurred to me!

Aside: if you're using this on a platform where it's easy to actually share the code itself, please don't use this. It might look pretty, but you can't copy from it easily. Plus it's inaccessible unless you've jumped through the hoops to make it so, at which point you might as well just link to the code directly.

Yeah, I've found myself using Carbon for sharing code in my tweets, really it's the only time I use it.

It's already pretty easy to do this without Carbon -- at least on Windows.

1. Hit print screen on your keyboard

2. Select the rectangle area that you want to capture

3. Paste it into a tweet

You don't even need an intermediate image on your computer unless you wanted to crop it before sending it to Twitter.

You may also want to consider a step 0 which is to temporarily bump up the font size in your editor to make it more readable in a tweet.

Command+Shift+4 on mac. And on Ubuntu there was something too, but I’ve forgotten the combo

Shift+PrintScreen. It freezes the screen and lets you draw a rectangle over the area you want to capture.

> It freezes the screen and lets you draw a rectangle over the area you want to capture.

This is what Windows 10 does when you hit print screen on its own (as of a recent'ish update).

Then there's also:

alt + print screen to automatically capture the focused window.

And ctrl + print screen to capture all monitors instead of the focused window.

People use this in presentations, but wait if you make a mistake across many slides :) I think it’s worth looking into a better way to create presentations with code (there are many).

Slides are often (usually?) shared, which would now be rendered uncopyable.

You could include a text file with the full source.

True, I guess a code repository link is common and even more useful than just a code snippet.

People who are using solutions like this for slides, please try out pandoc.

Pandoc is usually associated with Latex, but in reality its scope is really broad. I have been using it to convert markdown to slides for a while and it works quite well (Plus you get good syntax highlighting through pygments).

Ref: https://pandoc.org/MANUAL.html#producing-slide-shows-with-pa...

Silicon [1] is a similar solution implemented in Rust and can work without browser & Internet.

[1] https://github.com/Aloxaf/silicon

When adding code to tweets, IMO the most important thing is legibility on all devices. That means a large font size with minimal distractions.

In the example code snippet from their site more than half of the vertical space is taken up by unnecessary details added by Carbon (huge shadows, the window icons, borders and white space). Why would you want to waste half of your image on non-code elements when the goal is to share code?

You can turn those elements off by clicking the gear icon.

Why not just take a screenshot.

This just makes it look pixel perfect, and adds a clean frame around it... In case that somebody needs to share their code snippets on social media.

Would be cool if the service was a bit better integrated into Twitter.

Writing a Tweet, adding code that gets displayed as an image plus a link to some text-representation of that code-image.

I think a lot of people are wondering why this exists.

My first thought was in READMEs, just to be flashy. My thoughts were that any code made fancy in image form could also be found elsewhere, I don't think (brash assumption on my part) that this was meant to be the only way code is presented.

For something like twitter or whatever to be flashy though? Very cool. I dig it.

Reminds me of this site that I can no longer find called something like "instacode" (instacode.com is not it, at least not anymore). It had a more tongue in cheek vibe but it let you select different themes and even rotate your code in 3D and apply blur effects and such, then save an image. People got pretty creative.

It'd be fun to have optional licensing info of said code snippet.

What are usecases of sharing text as image? Is it to force user type from from image or use OCR to get the text?

For situations where that text needs to be formatted a specific way but can't due to the platform. For example, twitter (where you can/should also include a pastebin, gist, gh repo, etc...) where having an image is better for retention/engagement

Where the code is illustrative not intended on being literal copy paste, and the sharing of text without formatting hinders readability and illustrative intent

For when you have shared your code as text but want a pretty hero image to go with it?

I’ve found Polacode, a VSCode extension that creates screenshots locally, is much better.

macOS has this built in using Apple-Shift-4.

Please do not use this. Looks pretty but is unusable for code examples. The web has everything you need for pretty formatted text.

Can we please all agree to stop marketing our low-effort side projects like they were SV companies? The about page on this makes me puke.

@carbon_app -- bro, you're not an app! You're barely more than some JS on a page.

"Carbon is used by thousands of developers daily, including experts at..." -- 99% sure this is a lie. "Puffery" if we want to be charitable

"carbon" -- for chrissake "carbon" has like 50 meanings in computing. Name collide much? Did the author even bother to care?

"Beautiful" -- stop using this word. Nobody in computing seems to know what it means and we've cheapened its meaning to whatever stupid colorful, excessive-whitespace, overly-padded pile of crap that floats our way. Formatting that impresses snobby, wannabe graphic designers and clueless executives is not "beautiful", it is "trendy" or "contemporary" at best

Reply on news.ycombinator.com