Giter Site home page Giter Site logo

linecode / carbon-now-cli Goto Github PK

View Code? Open in Web Editor NEW

This project forked from mixn/carbon-now-cli

0.0 2.0 0.0 2.03 MB

🎨 Beautiful images of your code — from right inside your terminal.

License: MIT License

JavaScript 98.86% HTML 0.86% Rust 0.28%

carbon-now-cli's Introduction

Carbon CLI

🎨 Beautiful images of your code — from right inside your terminal.

Build Status XO code style MIT license Maintenance

Description

carbon.now.sh by @dawn_labs is a wonderful tool that lets you generate beautiful images of your source code through a great UI, letting you customize aspects like fonts, themes, window controls and much more.

carbon-now-cli gives you the full power of Carbon — right at your fingertips, inside the terminal.

Generate beautiful images from a source file, or sections of a source file, by running a single command.

Want to customize everything before generating the image? Run it in ⚡️ interactive mode ⚡️. 😎

Basic example

Features

  • 🖼 Downloads the real, high-quality image (no DOM screenshots)
  • Detects file type automatically
  • 🗂 Supports all file extensions supported by carbon.now.sh and more
  • 🖱 Allows selective highlighting via --start and --end
  • ⚡️ Interactive mode via --interactive
  • 🐶 Displays image directly in supported terminals
  • Reports each step and therefore shortens the wait
  • 👀 Saves to given location or only opens in browser for manual finish
  • 🌈 Supports saving as .png or .svg — just like Carbon
  • 📏 Supports 2x, 4x or 1x resolutions — just like Carbon
  • Tested
  • Maintained

Installation

npm

$ npm i -g carbon-now-cli

yarn

$ yarn global add carbon-now-cli

npx

$ npx carbon-now-cli <file>

Requirements

carbon-now-cli requires Node.js >=8.

Usage

$ carbon-now --help

Beautiful images of your code — from right inside your terminal.

Usage
  $ carbon-now <file>

Options
  -s, --start          Starting line of <file>
  -e, --end            Ending line of <file>
  -i, --interactive    Interactive mode
  -l, --location       Image save location, default: cwd
  -o, --open           Open in browser instead of saving

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, [])
};

and you’d like to make a beautiful image out of it. You could approach this in several ways.

Basic

$ carbon-now unfold.js

Takes the entire source of unfold.js, uses Carbon’s default settings and saves as .png into your cwd.

Result:

Basic example

Fully customized

$ carbon-now unfold.js -i

Launches an interactive mode, prompting questions, allowing you to customize every aspect of Carbon, like syntax theme, font-family, padding, drop-shadow, etc.

Given this input…

Example 2, Input

…the result will look like so 😍:

Example 2, Output

If you’re not sure what each question, e.g. “Make squared image?”, refers to, just confirm by hitting Enter — they will default to sensible, nice-looking things.

If needed, you can always check the default settings.

Selective

$ carbon-now unfold.js -s 3 -e 6

Reads and creates image based only of lines 3 to 6, instead of the entire file. Will throw an error if -s > -e.

Of course selective mode can be combined with interactive mode, just with like any other option. 😊

Result (without interactive mode):

Example 3

Full Example

For demonstration purposes, here is an example using all options.

$ carbon-now unfold.js -s 3 -e 6 -l ~/Desktop -i

This saves a beautiful image of lines 3 to 6 to ~/Desktop, after accepting custom wishes via interactive mode.

If you’re not sure about how the image will turn out you can always use -o or --open.

$ carbon-now unfold.js -s 3 -e 6 -i -o

This will open the image in the browser for final touches, instead of saving it immediately. 😌

License

MIT © Miloš Sutanovac

carbon-now-cli's People

Contributors

mathiasbynens avatar mixn avatar

Watchers

 avatar  avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.