Top Related Projects
:black_heart: Create and share beautiful images of your source code
:clapper: Colorful animations in terminal output
🖍 Terminal string styling done right
📄 CLI that generates beautiful README.md files
Quick Overview
The carbon-now-cli
is a command-line interface (CLI) tool that allows users to create beautiful images of their code snippets. It integrates with the Carbon website, a popular code-to-image generator, and provides a seamless way to capture and share code snippets.
Pros
- Ease of Use: The CLI tool is straightforward to use, with a simple command-line interface that makes it easy to generate code images.
- Customization: Users can customize the appearance of the code images, including the syntax highlighting, background color, and font.
- Integration with Carbon: The tool seamlessly integrates with the Carbon website, allowing users to quickly and easily create code images.
- Cross-platform Compatibility: The CLI tool is available for multiple platforms, including Windows, macOS, and Linux.
Cons
- Dependency on Carbon: The tool is dependent on the Carbon website, which means that if the Carbon service is unavailable or changes, the tool may not function as expected.
- Limited Functionality: The tool is focused on generating code images and does not provide additional features beyond that, which may limit its usefulness for some users.
- Potential Privacy Concerns: The tool requires users to upload their code snippets to the Carbon website, which may raise privacy concerns for some users.
- Lack of Offline Functionality: The tool requires an internet connection to generate code images, which may be a limitation for users in areas with poor internet connectivity.
Getting Started
To get started with carbon-now-cli
, follow these steps:
- Install the tool using npm:
npm install -g carbon-now-cli
- Run the tool with the
carbon-now
command, passing in the file path of the code you want to capture:
carbon-now path/to/your/code.js
-
The tool will open a browser window and display the generated code image. You can then save the image or share it with others.
-
You can customize the appearance of the code image by passing in additional options, such as the theme, background color, and font:
carbon-now path/to/your/code.js --theme seti --bg "rgba(171, 184, 195, 0.4)" --font "Hack"
Competitor Comparisons
:black_heart: Create and share beautiful images of your source code
Pros of Carbon
- Web-based interface for easy access and sharing
- More customization options for image styling
- Supports multiple languages and themes out-of-the-box
Cons of Carbon
- Requires internet connection to use
- Less suitable for batch processing or automation
- May have slower performance for large code snippets
Code Comparison
Carbon (React component):
export default function Carbon() {
return (
<div className="carbon-container">
<Editor />
<Controls />
<ExportButton />
</div>
)
}
carbon-now-cli (Node.js CLI):
#!/usr/bin/env node
const meow = require('meow')
const carbonNowCli = require('.')
const cli = meow(`
Usage
$ carbon-now <file>
$ carbon-now <file> -l <language>
`)
carbonNowCli(cli.input[0], cli.flags)
The Carbon project is a web-based application built with React, offering a user-friendly interface for creating code screenshots. It provides more visual customization options but requires an internet connection.
carbon-now-cli is a command-line tool that allows for quick code image generation from the terminal. It's more suitable for automation and batch processing but has fewer styling options compared to the web-based Carbon.
Both projects aim to create beautiful code images, but they cater to different use cases and preferences.
:clapper: Colorful animations in terminal output
Pros of chalk-animation
- Focuses on creating animated text in the terminal, offering a variety of animation styles
- Lightweight and easy to integrate into existing Node.js projects
- Provides a simple API for creating and controlling animations
Cons of chalk-animation
- Limited to text animations, while carbon-now-cli offers image generation capabilities
- May not be suitable for projects requiring static code snippets or images
- Less versatile in terms of output formats and sharing options
Code Comparison
chalk-animation:
const chalkAnimation = require('chalk-animation');
const rainbow = chalkAnimation.rainbow('Hello, animated world!');
setTimeout(() => {
rainbow.stop();
}, 2000);
carbon-now-cli:
carbon-now file.js -l /tmp -t oceanic-dark
Summary
chalk-animation is ideal for adding dynamic, colorful text animations to terminal applications, while carbon-now-cli excels in generating static, shareable code snippets as images. The choice between the two depends on whether you need animated terminal output or visually appealing code screenshots for documentation or sharing purposes.
🖍 Terminal string styling done right
Pros of chalk
- Lightweight and focused on terminal string styling
- Highly performant with minimal dependencies
- Widely adopted and well-maintained
Cons of chalk
- Limited to terminal output styling
- Doesn't provide image generation capabilities
- Requires manual implementation for complex formatting
Code comparison
carbon-now-cli:
const Carbon = require('carbon-now-cli');
Carbon('console.log("Hello, World!")', {
theme: 'seti',
backgroundColor: '#ADB7C1'
}).then(console.log);
chalk:
const chalk = require('chalk');
console.log(chalk.blue.bold('Hello') + ' World' + chalk.red('!'));
Key differences
- carbon-now-cli focuses on generating beautiful code images
- chalk specializes in styling terminal output
- carbon-now-cli offers more visual customization options
- chalk provides simpler and more direct string manipulation
- carbon-now-cli integrates with the Carbon web service
- chalk operates entirely locally without external dependencies
Both tools serve different purposes: carbon-now-cli for creating visually appealing code snippets, and chalk for enhancing terminal output. The choice between them depends on whether you need image generation or terminal styling capabilities.
📄 CLI that generates beautiful README.md files
Pros of readme-md-generator
- Specifically designed for generating README files, providing a more focused and tailored solution
- Interactive CLI prompts guide users through the README creation process
- Supports multiple languages and includes badges for various services
Cons of readme-md-generator
- Limited to README generation, while carbon-now-cli offers broader code snippet sharing capabilities
- May require more manual input compared to carbon-now-cli's automatic code parsing
- Less emphasis on visual aesthetics compared to carbon-now-cli's image output
Code Comparison
readme-md-generator:
const generateReadme = require('readme-md-generator');
generateReadme({
projectName: 'My Project',
projectDescription: 'A cool project'
});
carbon-now-cli:
const carbonNow = require('carbon-now-cli');
carbonNow('./myCode.js', {
backgroundColor: '#1A1A1A',
theme: 'seti'
});
While both tools are command-line utilities, they serve different purposes. readme-md-generator focuses on creating comprehensive README files for projects, while carbon-now-cli specializes in generating visually appealing code snippet images. The choice between the two depends on whether you need to create project documentation or share code visually.
Convert
designs to code with AI
Introducing Visual Copilot: A new AI model to turn Figma designs to high quality code using your components.
Try Visual CopilotREADME
ð¨ Beautiful images of your code â from right inside your terminal.
Table of Contents
Description
carbon-now-cli
brings the power of Carbon directly to your terminal. â¡ï¸
Generate beautiful images of your code with a single command.
Want to customize everything before generating the image? Run it in --interactive
mode. ð
Features
- ð¼ Downloads the real, high-quality image (no DOM screenshots)
- ⨠Detects file type automatically
- ð Supports all languages & covers extra ground
- â¡ï¸ Interactive mode via
--interactive
- ð Presets via
--preset
to save and re-use your favorite settings - ð± Selective processing via
--start
and--end
- ð Copies image to clipboard via
--to-clipboard
(cross-OS ð±) - ð Accepts file,
stdin
, or clipboard content as input - ðï¸ Supports custom theme colors
- ð¥ Supports concurrency for easier batch processing
- ð Saves to given location or opens in browser for manual finish
- ð¶ Displays image directly in supported terminals
- ð Supports different export types (
png
,svg
) - ð Supports different resolutions (
1x
,2x
,4x
) - â± Reports each step and therefore shortens the wait
- â Heavily tested
- â Actively maintained
- 𧺠â¦and more!
Installation
Bun
bun i -g carbon-now-cli
pnpm
pnpm i -g carbon-now-cli
npx
npx carbon-now-cli <file>
npm
npm i -g carbon-now-cli
yarn
yarn global add carbon-now-cli
Requirements
Usage
Beautiful images of your code â from right inside your terminal.
Usage
$ carbon-now <file>
$ pbpaste | carbon-now
$ carbon-now --from-clipboard
Options
--start, -s Starting line of input
--end, -e Ending line of input
--interactive, -i Interactive mode
--preset, -p Apply an existing preset
--save-to Image save location, default: cwd
--save-as Image name without extension, default: original-hash
--from-clipboard Read input from clipboard instead of file
--to-clipboard Copy image to clipboard instead of saving
--open-in-browser Open in browser instead of saving
--config Use a different, local config (read-only)
--settings Override specific settings for this run
--disable-headless Run Playwright in headful mode
--engine Use different rendering engine, default: `chromium`
Options: `chromium`, `firefox`, `webkit`
--skip-display Donât display the image in the terminal
Examples
See: https://github.com/mixn/carbon-now-cli#examples
Presets
Creating a Preset
Running the carbon-now
command generates a ~/.carbon-now.json
config file.
Presets are stored in this file and consist of available settings. You can create presets either manually or automatically via the --interactive
flag. When prompted, answer the following:
For example, naming the preset presentation
will add it to ~/.carbon-now.json
like this:
{
"latest-preset": {
// Equal to `presentation` below
},
"presentation": {
"theme": "base16-light",
"backgroundColor": "white",
"windowTheme": "none",
"windowControls": true,
"fontFamily": "Space Mono",
"fontSize": "18px",
"lineNumbers": false,
"firstLineNumber": 1,
"selectedLines": "*",
"dropShadow": false,
"dropShadowOffsetY": "20px",
"dropShadowBlurRadius": "68px",
"widthAdjustment": true,
"width": "20000px",
"lineHeight": "140%",
"paddingVertical": "35px",
"paddingHorizontal": "35px",
"squaredImage": false,
"watermark": false,
"exportSize": "2x",
"type": "png"
}
}
latest-preset
will be overwritten after each run, while presentation
remains until manually deleted.
Using a saved preset
To use a saved preset, simply run:
carbon-now _unfold.js --preset <name-of-preset>
If the preset or ~/.carbon-now.json
does not exist, carbon-now-cli
will fall back to the default settings and be smart about the rest.
Result:
Settings
interface CarbonCLIPresetInterface {
backgroundColor: string;
dropShadow: boolean;
dropShadowBlurRadius: string;
dropShadowOffsetY: string;
exportSize: '1x' | '2x' | '4x';
firstLineNumber: number;
fontFamily: CarbonFontFamilyType;
fontSize: string;
lineHeight: string;
lineNumbers: boolean;
paddingHorizontal: string;
paddingVertical: string;
selectedLines: string; // All: "*"; Lines 3-6: "3,4,5,6", etc.
squaredImage: boolean;
theme: CarbonThemeType;
type: 'png' | 'svg';
watermark: boolean;
widthAdjustment: boolean;
windowControls: boolean;
windowTheme: 'none' | 'sharp' | 'bw';
custom?: CarbonThemeHighlightsInterface;
width?: string;
// Below are detected automatically, and not persisted as keys
language?: string;
titleBar?: string;
}
Also see CarbonFontFamilyType
, CarbonThemeType
& CarbonThemeHighlightsInterface
Re-using settings
It just works. â¢
carbon-now
automatically reuses settings from previous runs, so you donât need to worry about manually reconfiguring them.
Custom theme colors
From v2.0
, carbon-now-cli
supports custom theme colors for detailed styling. Define a custom
key inside a preset that complies to the following type:
interface CarbonThemeHighlightsInterface {
background?: string;
text?: string;
variable?: string;
variable2?: string;
variable3?: string;
attribute?: string;
definition?: string;
keyword?: string;
operator?: string;
property?: string;
number?: string;
string?: string;
comment?: string;
meta?: string;
tag?: string;
}
Example ~/.carbon-now.json
with custom theme colors:
{
"hacker": {
"backgroundColor": "rgba(0, 255, 0, 1)",
"windowTheme": "bw",
"windowControls": true,
"fontFamily": "Anonymous Pro",
"fontSize": "18px",
"lineNumbers": false,
"firstLineNumber": 1,
"dropShadow": false,
"selectedLines": "*",
"dropShadowOffsetY": "20px",
"dropShadowBlurRadius": "68px",
"widthAdjustment": true,
"lineHeight": "133%",
"paddingVertical": "30px",
"paddingHorizontal": "30px",
"squaredImage": false,
"watermark": false,
"exportSize": "2x",
"type": "png",
"custom": {
"background": "rgba(0, 0, 0, 1)",
"text": "rgba(0, 255, 0, 1)",
"variable": "rgba(0, 255, 0, 1)",
"variable2": "rgba(0, 255, 0, 1)",
"attribute": "rgba(0, 255, 0, 1)",
"definition": "rgba(0, 255, 0, 1)",
"keyword": "rgba(0, 255, 0, 1)",
"operator": "rgba(0, 255, 0, 1)",
"property": "rgba(0, 255, 0, 1)",
"number": "rgba(0, 255, 0, 1)",
"string": "rgba(0, 255, 0, 1)",
"comment": "rgba(0, 255, 0, 1)",
"meta": "rgba(0, 255, 0, 1)",
"tag": "rgba(0, 255, 0, 1)"
}
}
}
carbon-now _unfold.js --preset hacker
Result:
Limitations
Please note that custom theme colors arenât applied with --open-in-browser
because they arenât query string parameters but instead use localStorage
, which is solely set inside the Playwright instance.
Local configs
Use the --config
flag for local configuration files. This is helpful for sharing presets across users in a project.
carbon-now _unfold.js --config local-config.json --preset dark
Local configs are read-only and differ from ~/.carbon-now.json
in that:
local-config.json
wonât be created if it doesnât exist.latest-preset
is not written tolocal-config.json
.
Examples
Assuming you have a file _unfold.js
with this content:
// Example from https://carbon.now.sh/
const unfold = (f, seed) => {
const go = (f, seed, acc) => {
const res = f(seed)
return res ? go(f, res[1], acc.concat([res[0]])) : acc
}
return go(f, seed, [])
};
Basic
carbon-now _unfold.js
Uses default settings and saves the image as .png
in your cwd
.
Result:
Fully customized
carbon-now _unfold.js --interactive
Launches interactive mode to customize every aspect, like theme, font-family
, padding
, etc.
Input:
Result:
Selective
carbon-now _unfold.js --start 3 --end 6
Generates an image for lines 3
to 6
. Will throw an error if --start
> --end
.
Result:
Copying to clipboard
Copies the image to clipboard instead of saving it. Requires xclip
on Linux.
carbon-now _unfold.js --to-clipboard
Linux
xclip
is required. Install with
sudo apt-get install xclip
Windows & macOS
It just works. â¢
Input Sources
In addition to files, input from stdin
or the clipboard is also supported.
stdin
pbpaste | carbon-now
echo '<h1>Hi</h1>' | carbon-now
Clipboard
carbon-now --from-clipboard
Overrides
You can override settings on a per-run basis.
carbon-now _unfold.js --preset presentation --settings '{"theme": "nord", "titleBar": "custom-title.js"}'
Result:
Full Example
carbon-now _unfold.js --start 3 --end 6 --save-to ~/Desktop --save-as example-23 --interactive
Saves an image of lines 3
-6
to ~/Desktop/example-23.png
with custom settings.
To preview in the browser instead of saving, do
carbon-now _unfold.js --start 3 --end 6 --interactive --open-in-browser
License
MIT © Miloš Sutanovac
Top Related Projects
:black_heart: Create and share beautiful images of your source code
:clapper: Colorful animations in terminal output
🖍 Terminal string styling done right
📄 CLI that generates beautiful README.md files
Convert
designs to code with AI
Introducing Visual Copilot: A new AI model to turn Figma designs to high quality code using your components.
Try Visual Copilot