Convert Figma logo to code with AI

alexeyraspopov logopicocolors

The tiniest and the fastest library for terminal output formatting with ANSI colors

1,291
46
1,291
27

Top Related Projects

21,793

🖍 Terminal string styling done right

1,609

The fastest Node.js library for formatting terminal text with ANSI colors~!

🌈Easily set your terminal text color & styles

get colors in your node.js console

1,496

🎨 Terminal color rendering library, support 8/16 colors, 256 colors, RGB color rendering output, support Print/Sprintf methods, compatible with Windows. GO CLI 控制台颜色渲染工具库,支持16色,256色,RGB色彩渲染输出,使用类似于 Print/Sprintf,兼容并支持 Windows 环境的色彩渲染

Quick Overview

Picocolors is a lightweight and fast library for adding colors and styles to console output in Node.js applications. It provides a simple API for applying various text colors, background colors, and styles to strings, making terminal output more visually appealing and easier to read.

Pros

  • Extremely small bundle size (less than 1KB)
  • No dependencies, making it lightweight and easy to integrate
  • Supports both CommonJS and ES modules
  • Automatically detects color support in the terminal

Cons

  • Limited set of styling options compared to some more comprehensive libraries
  • No support for custom color definitions
  • Lacks some advanced features like gradient colors or image output

Code Examples

Basic color usage:

import pc from 'picocolors';

console.log(pc.red('This text is red'));
console.log(pc.bgBlue('This has a blue background'));

Combining styles:

import pc from 'picocolors';

console.log(pc.bold(pc.green('This is bold and green')));
console.log(pc.underline(pc.yellow('This is underlined and yellow')));

Conditional color application:

import pc from 'picocolors';

const isColorSupported = pc.isColorSupported;

console.log(isColorSupported ? pc.red('Colored output') : 'Plain output');

Getting Started

To use picocolors in your project, first install it using npm:

npm install picocolors

Then, import and use it in your JavaScript file:

import pc from 'picocolors';

console.log(pc.blue('Hello, colorful world!'));
console.log(pc.bgYellow(pc.black('Black text on yellow background')));

For CommonJS environments, use require instead:

const pc = require('picocolors');

Competitor Comparisons

21,793

🖍 Terminal string styling done right

Pros of chalk

  • More feature-rich with support for nested styles, custom themes, and gradients
  • Extensive API with methods for various color and style combinations
  • Well-established project with a large community and ecosystem

Cons of chalk

  • Larger package size and potentially slower performance
  • More complex API, which may be overkill for simple use cases
  • Higher memory usage due to additional features

Code comparison

chalk:

import chalk from 'chalk';

console.log(chalk.blue.bold('Hello world!'));
console.log(chalk.green('Nested styles', chalk.underline.bgRed('combined')));

picocolors:

import pc from 'picocolors';

console.log(pc.blue(pc.bold('Hello world!')));
console.log(pc.green('Nested styles' + pc.underline(pc.bgRed('combined'))));

Summary

Chalk offers a more comprehensive set of features and a richer API, making it suitable for complex styling needs. However, this comes at the cost of a larger package size and potentially higher resource usage. Picocolors, on the other hand, provides a simpler and more lightweight alternative, focusing on essential color and style functionality with better performance. The choice between the two depends on the specific requirements of your project, balancing feature richness against simplicity and performance.

1,609

The fastest Node.js library for formatting terminal text with ANSI colors~!

Pros of kleur

  • Supports chaining of color methods for more complex styling
  • Offers a forced mode to enable colors even when not auto-detected
  • Provides a more extensive API with additional color and style options

Cons of kleur

  • Slightly larger bundle size compared to picocolors
  • May have a steeper learning curve due to more features and options

Code Comparison

kleur:

import kleur from 'kleur';

console.log(kleur.red().bold().underline('Hello, world!'));
console.log(kleur.green('This is green').bold('This is bold green'));

picocolors:

import pc from 'picocolors';

console.log(pc.red(pc.bold(pc.underline('Hello, world!'))));
console.log(pc.green('This is green') + pc.bold('This is bold green'));

Both libraries provide similar functionality for adding colors to console output, but kleur offers a more fluent API with method chaining. picocolors, on the other hand, focuses on simplicity and a smaller footprint. The choice between the two depends on the specific needs of the project, with kleur being more suitable for complex styling requirements and picocolors for lightweight applications where bundle size is a priority.

🌈Easily set your terminal text color & styles

Pros of Colorette

  • More comprehensive color support, including 256 and TrueColor
  • Includes color detection and forced color modes
  • Slightly more extensive documentation

Cons of Colorette

  • Larger package size (3.5KB vs 1KB for Picocolors)
  • Potentially slower performance due to more features
  • More complex API, which may be overkill for simple use cases

Code Comparison

Picocolors:

import pc from 'picocolors';

console.log(pc.red('Error!'));
console.log(pc.blue('Info'));

Colorette:

import { red, blue } from 'colorette';

console.log(red('Error!'));
console.log(blue('Info'));

Both libraries offer similar basic functionality for adding colors to console output. Picocolors uses a single import with methods, while Colorette allows for individual color function imports. Colorette provides more advanced features like chaining and nested styles, which may be beneficial for complex formatting needs.

Overall, Picocolors is lighter and faster, making it ideal for simple color needs, while Colorette offers more features and flexibility at the cost of a slightly larger footprint.

get colors in your node.js console

Pros of colors.js

  • More feature-rich with support for various color formats and styles
  • Includes additional functionality like background colors and custom themes
  • Wider browser compatibility and longer history of use

Cons of colors.js

  • Larger package size, which may impact performance and load times
  • More complex API, potentially leading to a steeper learning curve
  • Higher maintenance overhead due to more features and dependencies

Code Comparison

colors.js:

const colors = require('colors');
console.log('Hello'.green); // outputs green text
console.log('World'.blue.bgRed); // blue text with red background
console.log(colors.rainbow('Multicolor text')); // rainbow-colored text

picocolors:

const pc = require('picocolors');
console.log(pc.green('Hello')); // outputs green text
console.log(pc.blue(pc.bgRed('World'))); // blue text with red background
// No built-in rainbow function

Summary

colors.js offers more features and styling options, making it suitable for projects requiring extensive color manipulation. However, picocolors provides a lightweight alternative with a simpler API, focusing on essential color functionality. The choice between the two depends on the specific needs of the project, balancing feature richness against performance and simplicity.

1,496

🎨 Terminal color rendering library, support 8/16 colors, 256 colors, RGB color rendering output, support Print/Sprintf methods, compatible with Windows. GO CLI 控制台颜色渲染工具库,支持16色,256色,RGB色彩渲染输出,使用类似于 Print/Sprintf,兼容并支持 Windows 环境的色彩渲染

Pros of color

  • More comprehensive feature set, including RGB/HSL color support and 256-color mode
  • Provides additional utility functions like color mixing and conversion
  • Supports Windows console coloring out of the box

Cons of color

  • Larger package size and potentially higher performance overhead
  • More complex API, which may be overkill for simple use cases
  • Requires more setup and configuration for basic usage

Code Comparison

picocolors:

import pc from 'picocolors';

console.log(pc.red('Error!'));
console.log(pc.blue('Info'));

color:

import "github.com/gookit/color"

color.Red.Println("Error!")
color.Blue.Println("Info")

Both libraries provide similar basic functionality for console coloring, but color offers more advanced features at the cost of increased complexity. picocolors focuses on simplicity and performance, making it ideal for projects that require basic color output. color is better suited for applications needing more advanced color manipulation and broader platform support.

Convert Figma logo designs to code with AI

Visual Copilot

Introducing Visual Copilot: A new AI model to turn Figma designs to high quality code using your components.

Try Visual Copilot

README

picocolors

The tiniest and the fastest library for terminal output formatting with ANSI colors.

import pc from "picocolors"

console.log(
  pc.green(`How are ${pc.italic(`you`)} doing?`)
)
  • No dependencies.
  • 14 times smaller and 2 times faster than chalk.
  • Used by popular tools like PostCSS, SVGO, Stylelint, and Browserslist.
  • Node.js v6+ & browsers support. Support for both CJS and ESM projects.
  • TypeScript type declarations included.
  • NO_COLOR friendly.

Motivation

With picocolors we are trying to draw attention to the node_modules size problem and promote performance-first culture.

Prior Art

Credits go to the following projects:

Benchmarks

The space in node_modules including sub-dependencies:

$ node ./benchmarks/size.js
Data from packagephobia.com
  chalk       101 kB
  cli-color  1249 kB
  ansi-colors  25 kB
  kleur        21 kB
  colorette    17 kB
  nanocolors   16 kB
+ picocolors    7 kB

Library loading time:

$ node ./benchmarks/loading.js
  chalk          6.167 ms
  cli-color     31.431 ms
  ansi-colors    1.585 ms
  kleur          2.008 ms
  kleur/colors   0.773 ms
  colorette      2.476 ms
  nanocolors     0.833 ms
+ picocolors     0.466 ms

Benchmark for simple use case:

$ node ./benchmarks/simple.js
  chalk         24,066,342 ops/sec
  cli-color        938,700 ops/sec
  ansi-colors    4,532,542 ops/sec
  kleur         20,343,122 ops/sec
  kleur/colors  35,415,770 ops/sec
  colorette     34,244,834 ops/sec
  nanocolors    33,443,265 ops/sec
+ picocolors    33,271,645 ops/sec

Benchmark for complex use cases:

$ node ./benchmarks/complex.js
  chalk            969,915 ops/sec
  cli-color        131,639 ops/sec
  ansi-colors      342,250 ops/sec
  kleur            611,880 ops/sec
  kleur/colors   1,129,526 ops/sec
  colorette      1,747,277 ops/sec
  nanocolors     1,251,312 ops/sec
+ picocolors     2,024,086 ops/sec

Usage

Picocolors provides an object which includes a variety of text coloring and formatting functions

import pc from "picocolors"

The object includes following coloring functions: black, red, green, yellow, blue, magenta, cyan, white, gray.

console.log(`I see a ${pc.red("red door")} and I want it painted ${pc.black("black")}`)

The object also includes following background color modifier functions: bgBlack, bgRed, bgGreen, bgYellow, bgBlue, bgMagenta, bgCyan, bgWhite and bright variants bgBlackBright, bgRedBright, bgGreenBright, bgYellowBright, bgBlueBright, bgMagentaBright, bgCyanBright, bgWhiteBright.

console.log(
  pc.bgBlack(
    pc.white(`Tom appeared on the sidewalk with a bucket of whitewash and a long-handled brush.`)
  )
)

Besides colors, the object includes following formatting functions: dim, bold, hidden, italic, underline, strikethrough, reset, inverse and bright variants blackBright, redBright, greenBright, yellowBright, blueBright, magentaBright, cyanBright, whiteBright.

for (let task of tasks) {
  console.log(`${pc.bold(task.name)} ${pc.dim(task.durationMs + "ms")}`)
}

The library provides additional utilities to ensure the best results for the task:

  • isColorSupported — boolean, explicitly tells whether or not the colors or formatting appear on the screen

    import pc from "picocolors"
    
    if (pc.isColorSupported) {
      console.log("Yay! This script can use colors and formatters")
    }
    
  • createColors(enabled) — a function that returns a new API object with manually defined color support configuration

    import pc from "picocolors"
    
    let { red, bgWhite } = pc.createColors(options.enableColors)
    

Replacing chalk

  1. Replace package name in import:

    - import chalk from 'chalk'
    + import pico from 'picocolors'
    
  2. Replace variable:

    - chalk.red(text)
    + pico.red(text)
    
  3. Replace chains to nested calls:

    - chalk.red.bold(text)
    + pico.red(pico.bold(text))
    
  4. You can use colorize-template to replace chalk’s tagged template literal.

    + import { createColorize } from 'colorize-template'
    
    + let colorize = createColorize(pico)
    - chalk.red.bold`full {yellow ${"text"}}`
    + colorize`{red.bold full {yellow ${"text"}}}`
    

NPM DownloadsLast 30 Days