https://github.com/webdiscus/ansis

Small and fast Node.js lib to colorize terminal output. Lightweight but powerful alternative to Chalk. Supports Bun, Deno, Next.JS.
https://github.com/webdiscus/ansis
ansi bun chalk cli colorette colors console deno escape javascript kleur log nextjs nodejs picocolors styles terminal
Last synced: about 1 month ago
JSON representation
Small and fast Node.js lib to colorize terminal output. Lightweight but powerful alternative to Chalk. Supports Bun, Deno, Next.JS.
Host: GitHub
URL: https://github.com/webdiscus/ansis
Owner: webdiscus
License: isc
Created: 2021-12-24T18:16:58.000Z (over 3 years ago)
Default Branch: master
Last Pushed: 2024-04-24T13:37:16.000Z (about 1 year ago)
Last Synced: 2024-05-01T16:52:12.501Z (about 1 year ago)
Topics: ansi, bun, chalk, cli, colorette, colors, console, deno, escape, javascript, kleur, log, nextjs, nodejs, picocolors, styles, terminal
Language: JavaScript
Homepage:
Size: 647 KB
Stars: 65
Watchers: 2
Forks: 5
Open Issues: 0
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- Contributing: CONTRIBUTING.md
- Funding: .github/FUNDING.yml
- License: LICENSE
- Code of conduct: CODE_OF_CONDUCT.md
- Security: SECURITY.md
Awesome Lists containing this project

awesome - webdiscus/ansis - CJS/ESM ANSI color library for CI, terminals and Chromium-based browser consoles. Compatible with Bun, Deno, Next.JS. (JavaScript)
awesome - webdiscus/ansis - CJS/ESM ANSI color library for CI, terminals and Chromium-based browser consoles. Compatible with Bun, Deno, Next.JS. (JavaScript)
README

        



  

    

  

  [ANSI S]tyles



[![npm](https://img.shields.io/npm/v/ansis?logo=npm&color=brightgreen "npm package")](https://www.npmjs.com/package/ansis "download npm package")

[![node](https://img.shields.io/node/v/ansis)](https://nodejs.org)

[![Test](https://github.com/webdiscus/ansis/actions/workflows/test.yml/badge.svg)](https://github.com/webdiscus/ansis/actions/workflows/test.yml)

[![codecov](https://codecov.io/gh/webdiscus/ansis/branch/master/graph/badge.svg?token=H7SFJONX1X)](https://codecov.io/gh/webdiscus/ansis)

[![downloads](https://img.shields.io/npm/dm/ansis)](https://www.npmjs.com/package/ansis)

[![install size](https://packagephobia.com/badge?p=ansis)](https://packagephobia.com/result?p=ansis)

ANSI color library with support for CI, terminals, and Chromium-based browser consoles.\

Ansis is focused on [small size](#compare-size) and [speed](#benchmark) while providing rich [functionality](#compare) and handling [edge cases](#handling-input-arguments).

### 🚀 [Install and Quick Start](#install) ⚖️ [Alternatives](#alternatives) ✨[Why Ansis](#why-ansis)  🔧[Compatibility Check](#compatibility)

![Ansis demo](docs/img/ansis-demo.png)

[![Open in StackBlitz](https://developer.stackblitz.com/img/open_in_stackblitz.svg)](https://stackblitz.com/edit/stackblitz-starters-gs2gve?file=index.js)



## 💡 Highlights

- Supports **ESM**, **CommonJS**, **TypeScript** across **Node.js**, **Bun**, **Deno**, **Next.JS** runtimes

- Works in [Chromium-based](#browsers-compatibility) browsers such as **Chrome**, **Edge**, **Opera**, **Brave**, **Vivaldi**

- Default and [named import](#import): `import ansis, { red, green, bold, dim } from 'ansis'`

- [Chained syntax](#chained-syntax): `red.bold.underline('text')`

- Nested [**tagged template strings**](#nested-syntax): ``` red`Error: ${blue`file.js`} not found!` ```

- [ANSI styles](#base-colors): `dim` **`bold`** _`italic`_ `underline` `strikethrough`

- [ANSI 16 colors](#base-colors): ``` red`Error!` ``` ``` redBright`Error!` ``` ``` bgRed`Error!` ``` ``` bgRedBright`Error!` ```

- [ANSI 256 colors](#256-colors): ``` fg(56)`violet` ``` ``` bg(208)`orange` ```

- [Truecolor](#truecolor) (**RGB & HEX**): ``` rgb(224, 17, 95)`Ruby` ``` ``` hex('#96C')`Amethyst` ```

- Automatic [fallback](#fallback): Truecolor → 256 colors → 16 colors → no colors

- [Extend base colors](#extend-colors) with named Truecolor

- Raw ANSI escape codes: ``` `foo ${red.open}red{red.close} bar` ```

- Strip ANSI escape codes with `ansis.strip()`

- Auto-detects [color support](#color-support) across a wide range of [environments](#color-support)

- Supports [ENV variables](#cli-vars) and [flags](#cli-flags): [`NO_COLOR`](using-env-no-color), [`FORCE_COLOR`](#using-env-force-color), [`COLORTERM`](#using-env-colorterm), `--no-color`, `--color`

- [Drop-in replacement](#why-ansis) for [`chalk`](#replacing-chalk) [`ansi-colors`](#replacing-ansi-colors) [`colorette`](#replacing-colorette) [`picocolors`](#replacing-picocolors)

## 🛠️ Usage

```js

import ansis, { red, cyan, fg, hex } from 'ansis';

ansis.blueBright('file.txt')

red`Error: ${cyan(file)} not found!`

red.bgWhite`ERROR`

fg(215)`ANSI 256 colors`

hex('#E0115F').bold.underline('Truecolor')

```



## ⚖️ Alternatives

The most popular ANSI libraries, similar to Ansis:

[chalk][chalk], [picocolors][picocolors], [colorette][colorette], [kleur][kleur], [ansi-colors][ansi-colors], [kolorist][kolorist], [cli-color][cli-color], [colors-cli][colors-cli], [colors.js][colors.js], [tinyrainbow][tinyrainbow]

✅ [Compare features](#compare) 🧩 [Handling edge cases](#handling-input-arguments) 📦 [Compare package sizes](#compare-size) 📊 [Benchmarks](#benchmark)



## ✨ [Why use Ansis](#switch-to-ansis)

As of 2025, two of the [smallest](#compare-size) and [fastest](#benchmark) ANSI libraries are **Ansis** and **Picocolors**.

Both are [recommended](https://github.com/es-tooling/module-replacements/blob/main/docs/modules/chalk.md) by the [ES Tooling](https://github.com/es-tooling) community as modern replacements for older, larger libraries.

### 📦 Unpacked size

The package size in `node_modules` directory:

- `picocolors`: [6.4 kB][npm-picocolors] (not minimized) - A micro library with basic features.

- `аnsis`: [6.8 kB][npm-ansis] (minimized) - A powerful library containing all the features you need.

- `chalk`:  [44.2 kB][npm-chalk] (not minimized) - Provides similar functionality to Ansis.

### ⚡ Performance

- `picocolors`: The [fastest](#bench-simple) when applying a single style (e.g., `red`) only.

- `аnsis`: The [fastest](#bench-2-styles) when applying two or more styles (e.g., `red` + `bgWhite`).

- `chalk`: Slower than both **Ansis** and **Picocolors** in all use cases.

> [!CAUTION]

> **Picocolors** doesn't handle important **edge cases**, so it is the fastest and smallest.

>

> **Picocolors** is faster only in a [simple](#bench-simple) micro-benchmark, which does not reflect real world usage.\

> In a more complex benchmark, **Ansis** is much [closer](#bench-picocolors-complex) to **Picocolors** results or even [faster](#bench-3-styles).



### 🧩 Edge cases

#### Absent, `undefined` or `null` arguments

**Ansis** handles these cases correctly.

```js

ansis.red()          // ✅ ''

chalk.red()          // ✅ ''

pico.red()           // ❌ \e[31mundefined\e[39m

ansis.red(undefined) // ✅ ''

chalk.red(undefined) // ❌ \e[31mundefined\e[39m

pico.red(undefined)  // ❌ \e[31mundefined\e[39m

ansis.red(null)      // ✅ ''

chalk.red(null)      // ❌ \e[31mnull\e[39m

pico.red(null)       // ❌ \e[31mnull\e[39m

ansis.reset()        // ✅ \e[0m

chalk.reset()        // ❌ ''

pico.reset()         // ❌ \e[0mundefined\e[0m

```

See more details about [handling input arguments](#handling-input-arguments) in various libraries.

#### Empty string

**Ansis** and **Chalk** handle this case and return an empty string without ANSI codes as expected.\

However, **Picocolors** doesn't handle this case.

```js

ansis.red('')          // ✅ ''

chalk.red('')          // ✅ ''

pico.red('')           // ❌ \e[31m\e[39m

```

#### Break style at New Line

**Ansis** and **Chalk** add a style break at each `new line` to correctly display multi-line text.\

However, **Picocolors** doesn't handle this case.

```js

ansis.bgRed('\n ERROR \n') + ansis.cyan('The file not found!') // ✅

chalk.bgRed('\n ERROR \n') + chalk.cyan('The file not found!') // ✅

pico.bgRed('\n ERROR \n') + pico.cyan('The file not found!')   // ❌

```

![Break style at New Line](docs/img/break-line-compare.png)

#### Nested template strings

Only **Ansis** handles this very useful use case.

```js

ansis.red`R ${ansis.green`G ${ansis.blue`B`} G`} R` // ✅

chalk.red`R ${chalk.green`G ${chalk.blue`B`} G`} R` // ❌

pico.red`R ${pico.green`G ${pico.blue`B`} G`} R`    // ❌

```

![Nested template strings](docs/img/nested-template-strings-compare.png)

### 🔧 Maintenance

As of 2025, only **Ansis**, **Chalk**, and **Picocolors** are actively maintained, unlike many other libraries:

- `colorette`: Last updated [2 years ago][npm-colorette]

- `ansi-colors`: Last updated [3 years ago][npm-ansi-colors]

- `kleur`: Last updated [3 years ago][npm-kleur]

- `colors.js`: Last updated [2 years ago][npm-colors.js]

- `cli-color`: Last updated [1 year ago][npm-cli-color]

- `colors-cli`: Last updated [1 year ago][npm-colors-cli]



### 🤔 Which One Should You Use?

- If you only use a single style, e.g., `red('foo')`, **Picocolors** is the best solution.

- However, if you need more, like combining multiple styles (e.g., `red` + `bold` + `bgWhite`),\

  [256 colors](#256-colors), [Truecolor](#truecolor),

  or support for a wide range of [environments](#color-support),

  then **Ansis** is the better choice.

#### Checklist:

- Does support for ESM or CJS matter?

  - ✅ Ansis: `ESM` and `CJS`

  - ☑️ Picocolors: `CJS` only

- Does it matter if a library performs [~60 million](#bench-simple) or [~100 million](#bench-simple) **ops/sec** when outputting to the terminal?

  Spoiler: Both Ansis and Picocolors are more than [fast enough](#bench-picocolors-complex).

  - ✅ Picocolors

  - ❌ Ansis

- Does it matter if the unpacked size is [6.4 kB][npm-picocolors] or [6.8 kB][npm-ansis], a difference of **0.4 kB**?

  - ✅ Picocolors

  - ❌ Ansis

- Does support for [ANSI 256 colors](#256-colors) or [Truecolor](#truecolor) with [fallback](#fallback) matter?

  - ✅ Ansis

  - ❌ Picocolors

- Does handling [edge cases](#handling-input-arguments) matter?

  - ✅ Ansis

  - ❌ Picocolors

- Does supporting a wide range of [environments](#color-support) matter?

  - ✅ Ansis

  - ❌ Picocolors

- Does keeping your code clean and readable matter?

  - ✅ Ansis ([default and named import](#import), [chained syntax](#chained-syntax), [nested **template strings**](#nested-syntax))

  - ☑️ Picocolors (default import, nested calls)

Explore the list of [features](#compare), [package sizes](#compare-size), and [benchmarks](#benchmark) compared to similar libraries.

> [!TIP]

>

> **To keep your code clean and readable:**

> - Use the chained syntax provided by libraries like `ansis` and `chalk

> - Avoid nested calls, as they are [much slower](#bench-3-styles) and less readable than the chained syntax.

#### Usage examples

```js

import ansis, { red, green, cyan } from 'ansis' // ✅✅ supports both default and named imports

import chalk from 'chalk'                       // ✅❌ doesn't support named import

import pico from 'picocolors'                   // ✅❌ doesn't support named import

ansis.red('Error')                         //      ansis ❌ slower than picocolors

chalk.red('Error')                         //      chalk ❌ slower than ansis

pico.red('Error')                          // picocolors ✅ fastest

red.bold.bgWhite`Error`                    //      ansis ✅✅✅ fastest, short, readable

chalk.red.bold.bgWhite('Error')            //      chalk ❌☑️✅ slower, short, readable

pico.red(pico.bold(pico.bgWhite('Error'))) // picocolors ❌❌❌ slowest, long, unreadable

green`Create ${blue.bold`React`} app.`                     //      ansis ✅ usability 😊

chalk.green(`Create ${chalk.blue.bold('React')} app.`)     //      chalk ☑️ usability 🙂

pico.green(`Create ${pico.blue(pico.bold('React'))} app.`) // picocolors ❌ usability 🥴

```

> [!TIP]

> Ansis supports **nested template strings**, so you can colorize text without using parentheses.

## [How to switch to Ansis](#switch-to-ansis)

- [Replacing `chalk`](#replacing-chalk)

- [Replacing `colorette`](#replacing-colorette)

- [Replacing `picocolors`](#replacing-picocolors)

- [Replacing `ansi-colors`](#replacing-ansi-colors)

- [Replacing `kleur`](#replacing-kleur)

- [Replacing `cli-color`](#replacing-cli-color)

---

#### [↑ top](#top)



## Install

```bash

npm install ansis

```



## Default and named import

**ESM**

```js

// Default import

import ansis from 'ansis';

// Named imports

import { red, green, bold, dim } from 'ansis';

```

**CommonJS**

```js

// Default import

const ansis = require('ansis');

// Named imports

const { red, green, bold, dim } = require('ansis');

```



## Tagged template literals

> [!TIP]

> Using [template literals](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Template_literals) you can omit parentheses ``` red(`error`) ``` → ``` red`error` ``` to keep your code clean and readable.

```js

import { cyan, red } from 'ansis';

let file = '/path/to/file.txt';

red`Error: File ${cyan(file)} not found!`;

```



## Nested template literals

Ansis correctly renders nested tagged template strings.

```js

import { green, red, yellow } from 'ansis';

red`Red ${yellow`Yellow ${green`Green`} Yellow`} Red`;

red`Error: ${yellow`Module ${green`ansis`} is missing!`} Installation required.`;

```



## Chained syntax

All colors, styles and functions are chainable. Each color or style can be combined in any order.

```js

import { red, bold, italic, hex } from 'ansis';

red.bold`text`;

hex('#FF75D1').bgCyan.bold`text`;

bold.bgHex('#FF75D1').cyan`text`;

italic.bold.yellow.bgMagentaBright`text`;

```

#### [↑ top](#top)



## ANSI Styles

`dim` **`bold`** _`italic`_ `underline` `strikethrough` `inverse` `visible` `hidden` `reset`

## ANSI 16 colors

| Standard Colors  | Bright Colors                                             | Standard Backgrounds | Bright Backgrounds                                              |

|:-----------------|:----------------------------------------------------------|:---------------------|:----------------------------------------------------------------|

| `black`          | `blackBright`
_aliases:_
`grey` (UK)
`gray` (US) | `bgBlack`            | `bgBlackBright`
_aliases:_
`bgGrey` (UK)
`bgGray` (US) |

| `red`            | `redBright`                                               | `bgRed`              | `bgRedBright`                                                   |

| `green`          | `greenBright`                                             | `bgGreen`            | `bgGreenBright`                                                 |

| `yellow`         | `yellowBright`                                            | `bgYellow`           | `bgYellowBright`                                                |

| `blue`           | `blueBright`                                              | `bgBlue`             | `bgBlueBright`                                                  |

| `magenta`        | `magentaBright`                                           | `bgMagenta`          | `bgMagentaBright`                                               |

| `cyan`           | `cyanBright`                                              | `bgCyan`             | `bgCyanBright`                                                  |

| `white`          | `whiteBright`                                             | `bgWhite`            | `bgWhiteBright`                                                 |



## ANSI 256 colors

256 color functions:

- **Foreground:** `ansi256(code)`, _alias_ `fg(code)`

- **Background:** `bgAnsi256(code)`, _alias_ `bg(code)`

> [!NOTE]

> The function names `fg(code)` and `bg(code)` are designed for brevity,

> while `ansi256(code)` and `bgAnsi256(code)` ensure compatibility with Chalk.

256 colors codes:



  

    

  



See [ANSI color codes](https://en.wikipedia.org/wiki/ANSI_escape_code#8-bit).

#### Fallback

If a terminal supports only 16 colors then ANSI 256 colors will be interpolated into base 16 colors.



  

    

  



#### Usage example

```js

import { bold, ansi256, fg, bgAnsi256, bg } from 'ansis';

// foreground color

ansi256(96)`Bright Cyan`;

fg(96)`Bright Cyan`; // alias for ansi256

// background color

bgAnsi256(105)`Bright Magenta`;

bg(105)`Bright Magenta`; // alias for bgAnsi256

// function is chainable

fg(96).bold`bold Bright Cyan`;

// function is avaliable in each style

bold.fg(96).underline`bold underline Bright Cyan`;

// you can combine the functions and styles in any order

bg(105).fg(96)`cyan text on magenta background`

```



## Truecolor

You can use the `hex` or `rgb` format.

Foreground function: `hex()` `rgb()`\

Background function: `bgHex()` `bgRgb()`

```js

import { bold, hex, rgb, bgHex, bgRgb } from 'ansis';

// foreground color

hex('#E0115F').bold`bold Ruby`;

hex('#96C')`Amethyst`;

rgb(224, 17, 95).italic`italic Ruby`;

// background color

bgHex('#E0115F')`Ruby`;

bgHex('#96C')`Amethyst`;

bgRgb(224, 17, 95)`Ruby`;

// you can combine the functions and styles in any order

bold.hex('#E0115F').bgHex('#96C')`ruby bold text on amethyst background`

```

#### [↑ top](#top)



## Fallback

The `ansis` supports fallback to supported color space.

```

Truecolor —> 256 colors —> 16 colors —> no colors (black & white)

```

If you use the `hex()`, `rgb()` or `ansis256()` functions in a terminal not supported Truecolor or 256 colors, then colors will be interpolated.

![output](https://github.com/webdiscus/ansis/raw/master/docs/img/ansis-fallback.png?raw=true "Fallback to ANSI colors")

#### [↑ top](#top)



## Extend base colors

Defaults, the imported `ansis` instance contains [base styles and colors](#base-colors).

To extend base colors with custom color names for Truecolor use the `ansis.extend()` method.

> [!TIP]

> You can find a color name by the hex code on the [Name that Color](https://chir.ag/projects/name-that-color/#FF681F) website.

Define a theme with your custom colors and extends the `ansis` object:

```js

import ansis from 'ansis';

const myTheme = {

  orange: '#FFAB40',

  pink: '#FF75D1',

};

// extend ansis this custom colors

ansis.extend(myTheme);

// you can destruct extended colors

const { orange, pink, red } = ansis;

// access to extended colors

console.log(ansis.orange.bold('orange bold'));

console.log(orange.italic`orange italic`);

console.log(pink`pink color`);

```

Usage example with TypeScript:

```ts

import ansis, { AnsiColorsExtend } from 'ansis';

const myTheme = {

  orange: '#FFAB40',

  pink: '#FF75D1',

};

// extend base colors with your custom theme

ansis.extend(myTheme);

// your custom logger with the support for extended colors

const log = (style: AnsiColorsExtend, message: string) => {

  console.log(ansis[style](message));

}

log('red', 'message'); // base color OK

log('orange', 'message'); // extended color OK

log('unknown', 'message'); // TypeScript Error

```

> [!WARNING]

>

> The extended color must be used as a first chain item.

>

> ```js

> ansis.orange.bold('orange bold'); // ✅ works fine

> ansis.bold.orange('bold orange'); // ❌ extended color as a subchain item doesn't work

> ```

---

#### [↑ top](#top)



## CLI environment variables

Defaults, the output in terminal console is colored and output in a file is uncolored.

To force disable or enable colored output you can use environment variables `NO_COLOR` and `FORCE_COLOR`.



#### `NO_COLOR`

The `NO_COLOR` variable should be presents with any not empty value.

The value is not important, e.g., `NO_COLOR=1` `NO_COLOR=true` disable colors.

See the [`NO_COLOR` standard](https://no-color.org/).



#### `FORCE_COLOR`

The `FORCE_COLOR` environment variable is used to enable ANSI colors in the terminal output.

The proposed [`FORCE_COLOR` standard](https://force-color.org/):

> When `FORCE_COLOR` is present and not an empty string (regardless of its value), it should force enable colors.

But Node.js supports the `FORCE_COLOR` variable in a different way, see [here](https://nodejs.org/api/cli.html#force_color1-2-3) and [here](https://nodejs.org/api/tty.html#writestreamhascolorscount-env).

Ansis interprets `FORCE_COLOR` in accordance with its support in Node.js, with slight adaptations:

```

FORCE_COLOR=false   // Disables colors

FORCE_COLOR=0       // Disables colors

FORCE_COLOR=true    // Auto detects the supported colors (if no color detected, enforce truecolor)

FORCE_COLOR=(unset) // Auto detects the supported colors (if no color detected, enforce truecolor)

FORCE_COLOR=1       // Enables 16 colors

FORCE_COLOR=2       // Enables 256 colors

FORCE_COLOR=3       // Enables truecolor

```

> [!IMPORTANT]

> Node.js [interprets](https://nodejs.org/api/cli.html#force_color1-2-3) the values `1`, `true` and an empty string `''` (unset value) as enabling 16 colors.

>

> Ansis interprets the value `1` as enabling exactly 16 colors.\

> The values `true` and an empty string indicate automatic detection of supported colors (16, 256, truecolor).

> If no color is detected, enforce using truecolor.

See:

- [`FORCE_COLOR` standard](https://force-color.org/)

- [Node.js getColorDepth](https://nodejs.org/api/tty.html#writestreamhascolorscount-env)

- [Node.js FORCE_COLOR=[1, 2, 3]](https://nodejs.org/api/cli.html#force_color1-2-3)

For example, _app.js_:

```js

import { red } from 'ansis';

console.log(red`red color`);

```

Execute the script in a terminal:

```

node app.js           # colored output in terminal

node app.js > log.txt # output in file without ANSI codes

NO_COLOR=1 node app.js              # force disable colors

FORCE_COLOR=0 node app.js           # force disable colors

FORCE_COLOR=1 node app.js > log.txt # force enable 16 colors

FORCE_COLOR=2 node app.js > log.txt # force enable 256 colors

FORCE_COLOR=3 node app.js > log.txt # force enable truecolor

```



#### `COLORTERM`

The `COLORTERM` environment variable is used by terminal emulators to indicate support for colors.

Its value can vary depending on the terminal emulator and the level of color support provided.

The commonly used values supported by `ansis`:

- `truecolor` or `24bit` - 16 million colors

- `ansi256` - ANSI 256 colors

- `ansi` - basic ANSI 16 colors

You can set the variable in cmd before running the Node script:

```

COLORTERM=ansi node script.js      # force enable 16 olors

COLORTERM=ansi256 node script.js   # force enable 256 colors

COLORTERM=truecolor node script.js # force enable truecolor

```

To set the color level in a script, create a JS file in which you define the `COLORTERM` environment variable with the needed value,

and import this file before `ansis`.

This can be useful, for example, for testing your cli application to ensure that the test results will be the same

regardless of the supported color level in different environments and terminals.

#### Force use truecolor

_enable-truecolor.js_

```js

process.env.COLORTERM = 'truecolor';

```

your script file:

```js

import './level-truecolor'; // <= force use truecolor

import { red, fg, hex } from 'ansis';

console.log(hex('#FFAB40')('orange')); // native ANSI RGB color value

console.log(fg(200)('pink'));          // native ANSI 256 color value

console.log(red('red'));               // native ANSI 16 color value

```

#### Force use 256 colors

_enable-256colors.js_

```js

process.env.COLORTERM = 'ansi256';

```

your script file:

```js

import './level-256colors'; // <= force use 256 colors

import { red, fg, hex } from 'ansis';

console.log(hex('#FFAB40')('orange')); // fallback to ANSI 256 color value

console.log(fg(200)('pink'));          // native ANSI 256 color value

console.log(red('red'));               // native ANSI 16 color value

```

#### Force use base 16 colors

_enable-16colors.js_

```js

process.env.COLORTERM = 'ansi';

```

your script file:

```js

import './level-16colors'; // <= force use 16 olors

import { red, fg, hex } from 'ansis';

console.log(hex('#FFAB40')('orange')); // fallback to ANSI 16 color value - `bright red`

console.log(fg(200)('pink'));          // fallback to ANSI 16 color value - `bright magenta`

console.log(red('red'));               // native ANSI 16 color value

```

#### [↑ top](#top)



### CLI arguments

Use cmd arguments `--no-color` to disable colors and `--color` to enable ones.

For example, an executable script _app.js_:

```js

#!/usr/bin/env node

import { red } from 'ansis';

console.log(red`text`);

```

Execute the script in a terminal:

```

./app.js                        # colored output in terminal

./app.js --no-color             # non colored output in terminal

./app.js > log.txt              # output in file without ANSI codes

./app.js --color > log.txt      # output in file with ANSI codes

```

> [!NOTE]

>

> Command-line arguments take precedence over environment variables.

---

#### [↑ top](#top)



## Color support

Ansis automatically detects the supported color space:

- Truecolor

- ANSI 256 colors

- ANSI 16 colors

- black & white (no colors)

Ansis has the method `isSupported()` that returns a `boolean` value whether the output supports ANSI color and styles.

```js

import ansis from 'ansis';

console.log('Color output: ', ansis.isSupported());

```

There is no standard way to detect which color space is supported.

The most common way to detect color support is to check the `TERM` and `COLORTERM` environment variables.

CI systems can be detected by checking for the existence of the `CI` and other specifically environment variables.

Combine that with the knowledge about which operating system the program is running on, and we have a decent enough way to detect colors.

| Terminal                         | ANSI 16
colors | ANSI 256
colors | True
Color |  env.
TERM   | env.
COLORTERM | Specifically ENV variables             |

|:---------------------------------|-------------------|:-------------------|:--------------|:---------------:|:-----------------:|:---------------------------------------|

| Azure CI                         | ✅                 | ❌                  | ❌             |      dumb       |                   | TF_BUILD
AGENT_NAME                 |

| GitHub CI                        | ✅                 | ✅                  | ✅             |      dumb       |                   | CI, GITHUB_ACTIONS                     |

| GitTea CI                        | ✅                 | ✅                  | ✅             |      dumb       |                   | CI, GITEA_ACTIONS                      |

| GitLab CI                        | ✅                 | ❌                  | ❌             |      dumb       |                   | CI, GITLAB_CI                          |

| Travis CI                        | ✅                 | ❌                  | ❌             |      dumb       |                   | TRAVIS                                 |

| PM2
not isTTY                 | ✅[^1]             | ✅[^1]              | ✅[^1]         |      dumb       |                   | PM2_HOME
pm_id                      |

| JetBrains TeamCity
>=2020.1.1 | ✅                 | ✅                  | ❌             |                 |                   | TEAMCITY_VERSION                       |

| JetBrains IDEA                   | ✅                 | ✅                  | ✅             | xterm-256color  |                   | TERMINAL_EMULATOR='JetBrains-JediTerm' |

| VS Code                          | ✅                 | ✅                  | ✅             | xterm-256color  |     truecolor     |                                        |

| Windows
Terminal              | ✅                 | ✅                  | ✅[^2]         |                 |                   |                                        |

| Windows
PowerShell            | ✅                 | ✅                  | ✅[^2]         |                 |                   |                                        |

| macOS Terminal                   | ✅                 | ✅                  | ❌             | xterm-256color  |                   |                                        |

| iTerm                            | ✅                 | ✅                  | ✅             | xterm-256color  |     truecolor     |                                        |

| Kitty                            | ✅                 | ✅                  | ✅             |   xterm-kitty   |     truecolor     |                                        |

| KDE Konsole                      | ✅                 | ✅                  | ✅             | xterm-256color  |     truecolor     |                                        |

[^1]: Colors supported depends on actual terminal.\

[^2]: The Windows terminal supports true color since Windows 10 revision 14931 (2016-09-21).

See also:

- [Truecolor Support in Output Devices](https://github.com/termstandard/colors#truecolor-support-in-output-devices).

- [So you want to render colors in your terminal](https://marvinh.dev/blog/terminal-colors/).

---

#### [↑ top](#top)



## Compare the features of most popular libraries

Run the command to see the support of some features by various libraries:

```

npm run compare

```

[![Open in StackBlitz](https://developer.stackblitz.com/img/open_in_stackblitz.svg)](https://stackblitz.com/edit/compare-colorize-libraries?file=index.js)

  

    Library

    Colors support

    Features

  

  

    

      - ESM | CJS


       - named import


      - naming colors

    

    16 | 256 | 16m | 🌐

    Fallback

    Chained
syntax

    Nested
template
strings
`${}`


    LF
\n

    Supports
ENV vars
CLI flags

  

  

    

      ansis


      ESM CJS


      ✅ named import
✅ standard

    

    ✅ ✅ ✅ ✅

    →256
→16
→b&w

    ✅

    ✅

    ✅

    NO_COLOR
FORCE_COLOR
COLORTERM
--no-color
--color

  

  

    chalk v5
ESM
❌ named import
✅ standard

    ✅ ✅ ✅ ✅

    →256
→16
→b&w

    ✅

    ❌

    ✅

    NO_COLOR
FORCE_COLOR
--no-color
--color

  

kolorist
ESM CJS
✅ named import
❌ standard

✅ ✅ ✅ ❌

→256
→b&w

❌

❌

❌

NO_COLOR
FORCE_COLOR

cli-color
CJS
❌ named import
✅ standard

✅ ✅ ❌ 🛑

→16
→b&w

✅

❌

❌

NO_COLOR

colors-cli
CJS
❌ named import
❌ standard

✅ ✅ ❌ 🛑

→b&w

✅

❌

✅

--no-color
--color

colors.js
CJS
❌ named import
❌ standard

✅ ❌ ❌ 🛑

→b&w

✅

❌

✅

FORCE_COLOR
--no-color
--color

ansi-colors
CJS
❌ named import
✅ standard

✅ ❌ ❌ ❌

❌

✅

❌

✅

FORCE_COLOR

colorette
ESM CJS
✅ named import
✅ standard

✅ ❌ ❌ 🛑

→b&w

❌

❌

❌

NO_COLOR
FORCE_COLOR
--no-color
--color

picocolors
CJS
❌ named import
✅ standard

✅ ❌ ❌ ❌

→b&w

❌

❌

❌

NO_COLOR
FORCE_COLOR
--no-color
--color

tinyrainbow
ESM
❌ named import
✅ standard

✅ ❌ ❌ ✅

→b&w

❌

❌

❌

NO_COLOR
FORCE_COLOR
FORCE_TTY
--no-color
--color

kleur
ESM CJS
✅ named import
✅ standard

❌ ❌ ❌ ✅
8 colors

→b&w

✅

❌

❌

NO_COLOR
FORCE_COLOR

### Notes

**Named import**\

ESM\

`import { red, green, blue } from 'lib';`\

CJS\

`const { red, green, blue } = require('lib');`

**Naming colors**

 - standard: colors have [standard names](#base-colors-and-styles), e.g.: `red`, `redBright`, `bgRed`, `bgRedBright`

 - _non-standard_: colors have lib-specific names, e.g.: `brightRed`, `bgBrightRed`, `red_b`, `red_btt`

#### Colors support

- `16` - [ANSI 16 colors](#base-colors) like `red`, `redBright`, `bgRed`, `bgRedBright`

- `256` - [ANSI 256 colors](#256-colors) methods, e.g.:

  - [`ansis`][ansis]: `ansi256(n)`, `bgAnsi256(n)`, aliases - `fg(n)`, `bg(n)`

  - [`chalk`][chalk]: `ansi256(n)`, `bgAnsi256(n)`

  - [`cli-color`][cli-color]: `xterm(n)`

  - [`colors-cli`][colors-cli]: `x`

- `16m` - [Truecolor](#truecolor) methods, e.g.: `hex()`, `bgHex()`, `rgb()`, `bgRgb()`

- 🌐 - Colored output in [Chromium-based](#browsers-compatibility) browser console:

  - ✅ - colored output

  - ❌ - b&w output

  - 🛑 - **fatal error** by compilation or in runtime

- [Fallback](#fallback) - Truecolor → 256 colors → 16 colors → no colors

#### Features

- **Chained syntax**\

  `lib.red.bold('text')`

- **Nested template strings**\

  ``` lib.red`text ${lib.cyan`nested`} text` ```

- `LF` - **Correct break styles** at `end-of-line` (`\n`).

  ```js

  console.log(bgGreen('\nAnsis\nNew Line\nNext New Line\n'))

  ```

  Outputs:\

  ![output](docs/img/break-style-nl.png?raw=true "break styles at EOL")



### Edge cases: input arguments

Compare how different libraries handle various input arguments in their functions.

| Library                        | `c.reset()`  | `c.red()`      | `c.red(undefined)` | `c.red(null)` | `c.red('')` |

|--------------------------------|--------------|----------------|--------------------|---------------|-------------|

| [`ansis`][ansis]               | ✅`\e[0m`     | ✅`''`          | ✅`''`              | ✅`''`         | ✅`''`       |

| [`chalk`][chalk]               | ❌`''`        | ✅`''`          | ❌`'undefined'`     | ❌`'null'`     | ✅`''`       |

| [`picocolors`][picocolors]     | ❌`undefined` | ❌`'undefined'` | ❌`'undefined'`     | ❌`'null'`     | ❌`'ESC'`    |

| [`tinyrainbow`][tinyrainbow]   | ❌`undefined` | ❌`'undefined'` | ❌`'undefined'`     | ❌`'null'`     | ❌`'ESC'`    |

| [`colorette`][colorette]       | ❌`''`        | ✅`''`          | ✅`''`              | ❌`'null'`     | ✅`''`       |

| [`kleur`][kleur]               | ❌`[object]`  | ❌`[object]`    | ❌`[object]`        | ❌`'null'`     | ❌`'ESC'`    |

| [`ansi-colors`][ansi-colors]   | ❌`''`        | ✅`''`          | ✅`''`              | ✅`''`         | ✅`''`       |

| [`kolorist`][kolorist]         | ❌`undefined` | ❌`'undefined'` | ❌`'undefined'`     | ❌`'null'`     | ❌`'ESC'`    |

| [`colors.js`][colors.js]       | ❌`''`        | ✅`''`          | ❌`'undefined'`     | ❌`'null'`     | ✅`''`       |

| [`cli-color`][cli-color]       | ❌`-`         | ❌`'ESC'`       | ❌`'ESC'`           | ❌`'ESC'`      | ❌`'ESC'`    |

| [`colors-cli`][colors-cli]     | ❌`-`         | ❌ `Error`      | ❌`'undefined'`     | ❌`'null'`     | ❌`'ESC'`    |

#### Legend:

- ✅`''` - Returns an _empty string_ without ANSI escape codes. This is the correct and expected behavior.

- ✅`\e[0m` - Returns the reset escape code.

- ❌`'ESC'` - Returns an _empty string_ **containing** ANSI escape codes, e.g., `\e[31m\e[39m`.

- ❌`'undefined'` - Returns the styled string `undefined`.

- ❌`'null'` - Returns the styled string `null`.

- ❌`[object]` - Returns an object of the library instance.

- ❌`-` - The feature is not supported.

- ❌`Error` - Causes a fatal error.

Other arguments are correctly handled by all libraries:

```js

c.red(0)       // '0' in red

c.red(false)   // 'false' in red

c.red(true)    // 'true' in red

c.red(5/'1px') // 'NaN' in red

c.red(1/0)     // 'Infinity' in red

```

**Ansis** ensures consistent and predictable behavior for edge-case inputs, making it a reliable choice for usage.

#### [↑ top](#top)



## Compare the size of most popular packages

| Npm package                    |          Dependencies          | Is Minified         |                                            Unpacked Size |                                                              Tarball size |

| :----------------------------- |:------------------------------:|---------------------|---------------------------------------------------------:|--------------------------------------------------------------------------:|

| [`picocolors`][picocolors]     |      [0][npm-picocolors]       | no                  |                                 [6.4 kB][npm-picocolors] |           [2.6 kB](https://arve0.github.io/npm-download-size/#picocolors) |

| [`ansis`][ansis]               |         [0][npm-ansis]         | uglified & minified |                                      [6.8 kB][npm-ansis] |                [3.6 kB](https://arve0.github.io/npm-download-size/#ansis) |

| [`tinyrainbow`][tinyrainbow]   |   [0][npm-tinyrainbow]         | uglified            |                                [8.1 kB][npm-tinyrainbow] |          [3.2 kB](https://arve0.github.io/npm-download-size/#tinyrainbow) |

| [`colorette`][colorette]       |       [0][npm-colorette]       | no                  |                                 [17.0 kB][npm-colorette] |            [4.9 kB](https://arve0.github.io/npm-download-size/#colorette) |

| [`kleur`][kleur]               |         [0][npm-kleur]         | no                  |                                     [20.3 kB][npm-kleur] |                [6.0 kB](https://arve0.github.io/npm-download-size/#kleur) |

| [`ansi-colors`][ansi-colors]   |      [0][npm-ansi-colors]      | no                  |                               [26.1 kB][npm-ansi-colors] |          [8.5 kB](https://arve0.github.io/npm-download-size/#ansi-colors) |

| [`kolorist`][kolorist]         |       [0][npm-kolorist]        | no                  |                                  [51.0 kB][npm-kolorist] |             [8.7 kB](https://arve0.github.io/npm-download-size/#kolorist) |

| [`colors.js`][colors.js]       |       [0][npm-colors.js]       | no                  |                                 [41.5 kB][npm-colors.js] |    [11.1 kB](https://arve0.github.io/npm-download-size/#@colors%2fcolors) |

| [`chalk`][chalk]               |         [0][npm-chalk]         | no                  |                                     [43.7 kB][npm-chalk] |               [13.4 kB](https://arve0.github.io/npm-download-size/#chalk) |

| [`cli-color`][cli-color]       |      [`5`][npm-cli-color]      | no                  | [754.0 kB](https://packagephobia.com/result?p=cli-color) |          [216.8 kB](https://arve0.github.io/npm-download-size/#cli-color) |

| [`colors-cli`][colors-cli]     |      [0][npm-colors-cli]       | no                  |                               [511.0 kB][npm-colors-cli] |         [361.7 kB](https://arve0.github.io/npm-download-size/#colors-cli) |

**Legend**

- **Dependencies:** Number of dependencies in the package.

- **Is Minified:** Indicates whether the distributed npm package is minified.

- **Unpacked Size:** The size of the npm package in the `node_modules/` directory, (incl. dependencies).

- **Tarball size:** The size of the downloaded `*.tgz` package file.\

  You can check the package size with the following command:

  ```bash

  curl -s -o package.tgz $(npm view  dist.tarball) && echo "Tarball size: $(stat -f%z package.tgz | awk '{printf "%.2f", $1/1024}') kB"

  ```

  just replace the `` with your package name.

**See also:**

- [npmjs](https://www.npmjs.com/package) - show install size of the published package, w/o dependencies

- [packagephobia](https://packagephobia.com) - show total install size, incl. dependencies

- [npm download size](https://arve0.github.io/npm-download-size) - show download size

- [pkg-size](https://pkg-size.dev) - find the true size of an npm package

- [bundlephobia](https://bundlephobia.com) - useless, doesn't show real tarball size of the downloaded npm package

---

## Show ANSI demo

```bash

git clone https://github.com/webdiscus/ansis.git

cd ./ansis

npm i

npm run demo

```

#### [↑ top](#top)



## Compatibility Check

Check the minimum version of your tool required for compatibility with the latest Ansis.

| Tool              | Version   | Compatibility | Supports |

|-------------------|-----------|---------------|----------|

| **Node.js**       | **v14+**  | ✅ Full support | CJS, ESM |

| **TypeScript/tsc**| **v5.0+** | ✅ Full support | CJS, ESM |

| **esbuild**       | **v0.8+** | ✅ Full support | CJS, ESM |

| **swc**           | **v1.2+** | ✅ Full support | CJS, ESM, FAUX |

| **tsup**          | **v4.0+** | ✅ Full support | CJS, ESM, FAUX |

| **tsx**           | **v3.0+** | ✅ Full support | CJS, ESM |

| **Rollup**        | **v2.0+** | ✅ Full support | CJS, ESM |

| **Vite**          | **v2.5+** | ✅ Full support | ESM |

| **Turbo**         | **v1.0+** | ✅ Full support | CJS, ESM |

| **Webpack**       | **v5.0+** | ✅ Full support | CJS, ESM |

**Supports:**

- **CJS**: CommonJS module support.

- **ESM**: ECMAScript module support.

- **FAUX**: Fake or non-standard approach to module resolution (seen in **swc**).



### Browser Compatibility for ANSI Codes

| Browser           | Version       | Colors Supported   |

|-------------------|---------------|--------------------|

| **Chrome**        | **v20+**      | TrueColor (16M)    |

| **Safari**        | **v10+**      | TrueColor (16M)    |

| **Edge**          | **v12+**      | TrueColor (16M)    |

| **Opera**         | **v12+**      | TrueColor (16M)    |

| **Brave**         | **v1.0+**     | TrueColor (16M)    |

| **Vivaldi**       | **v1.0+**     | TrueColor (16M)    |

> [!WARNING]

> **Firefox** doesn't natively support ANSI codes in the developer console.

#### [↑ top](#top)



## Benchmarks

> [!CAUTION]

> The benchmark results are meaningless numbers intended purely to promote the library and increase its popularity.

> All libraries are more than fast enough.

> These results only to show the effectiveness of micro-optimizations in the code, which does not impact on real-world usage.

>

> Of course **Picocolors** will be a little bit faster in a micro-benchmark since it has less code and doesn't handles [edge cases](#.handling-input-arguments).

>

> _Taken from the [comment](https://github.com/babel/babel/pull/13783#issuecomment-927317201) by the creator of Chalk._

To measure performance is used [benchmark.js](https://github.com/bestiejs/benchmark.js).

> [!WARNING]

>

> Results of [vitest benchmark](https://vitest.dev/config/#benchmark) are incorrect.

>

> The `vitest benchmark` generate **unreal** results.\

> For example, the results of the simple bench:

> ```

> chalk.red('foo') -  7.000.000 ops/sec

> ansis.red('foo') - 23.000.000 ops/sec (x3 faster is incorrect result)

> ```

>

> The actual performance results of Chalk and Ansis in this test are very similar.

### Run benchmarks

```bash

git clone https://github.com/webdiscus/ansis.git

cd ./ansis

npm i

npm run build

npm run bench

```

> ### Tested on

>

> MacBook Pro 16" M1 Max 64GB\

> macOS Sequoia 15.1\

> Node.js v22.11.0\

> Terminal `iTerm2` v3.5.0

---

> [!IMPORTANT]

>

> Each library uses the recommended **fastest** styling method to compare the **absolute performance**.

>

> In real practice, no one would use the **slowest** method (such as nested calls) to style a string when the library provides a **faster** and a **shorter** chained method.

>

> For example:

>

> ```js

> lib.red.bold.bgWhite(' ERROR ')           // ✅ faster, shorter, readable

> lib.red(lib.bold(lib.bgWhite(' ERROR '))) // ❌ slower, longer, unreadable

> ```



### Simple bench

The simple test uses only single style.

Picocolors, Colorette and Kleur do not support [chained syntax](#chained-syntax) or [correct style break](#new-line) (wenn used ``` `\n` ``` in a string),

so they are the fastest in this simple use case. _No function, no performance overhead_.

```js

ansis.red('foo')

chalk.red('foo')

picocolors.red('foo')

...

```

```diff

+  [email protected]    109.212.939 ops/sec

   [email protected]    108.044.800 ops/sec

   [email protected]          87.800.739 ops/sec

-> [email protected]          60.606.043 ops/sec  -44.5%

-  [email protected]          55.702.479 ops/sec  -48.9%

   [email protected]       37.069.069 ops/sec

   [email protected]    14.364.378 ops/sec

   [email protected]          7.060.583 ops/sec

   [email protected]       2.753.751 ops/sec

   [email protected]       897.746 ops/sec

```



### Using 2 styles

Using only 2 styles, picocolors is already a bit slower, because using the [chained syntax](#chained-syntax) is faster than nested calls.

```js

ansis.red.bold('foo')

chalk.red.bold('foo')

picocolors.red(picocolors.bold('foo')) // chained syntax is not supported

...

```

```diff

+  [email protected]          60.468.181 ops/sec

-  [email protected]     58.777.183 ops/sec    -2.8%

-  [email protected]          47.789.020 ops/sec   -21.5%

   [email protected]     33.387.988 ops/sec

   [email protected]       13.420.047 ops/sec

   [email protected]           5.972.681 ops/sec

   [email protected]     4.086.412 ops/sec

   [email protected]          3.018.244 ops/sec

   [email protected]       1.817.039 ops/sec

   [email protected]       695.601 ops/sec

```



### Using 3 styles

Using 3 styles, picocolors is 2x slower than ansis.

```js

ansis.red.bold.bgWhite('foo')

chalk.red.bold.bgWhite('foo')

picocolors.red(picocolors.bold(picocolors.bgWhite('foo'))) // chained syntax is not supported

...

```

```diff

+  [email protected]          59.463.640 ops/sec

-  [email protected]          42.166.783 ops/sec  -29.0%

-  [email protected]     32.434.017 ops/sec  -45.5% (~2x slower than Ansis)

   [email protected]     13.008.117 ops/sec

   [email protected]        5.608.244 ops/sec

   [email protected]           5.268.630 ops/sec

   [email protected]     2.145.517 ops/sec

   [email protected]          1.686.728 ops/sec

   [email protected]       1.453.611 ops/sec

   [email protected]       590.467 ops/sec

```



### Using 4 styles

In rare cases, when using 4 styles, picocolors becomes 3.4x slower than ansis.

```js

ansis.red.bold.underline.bgWhite('foo')

chalk.red.bold.underline.bgWhite('foo')

picocolors.red(picocolors.bold(picocolors.underline(picocolors.bgWhite('foo')))) // chained syntax is not supported

...

```

```diff

+  [email protected]          59.104.535 ops/sec

-  [email protected]          36.147.547 ops/sec  -38.8%

-  [email protected]     17.581.709 ops/sec  -70.2% (~3x slower than Ansis)

   [email protected]      7.981.171 ops/sec

   [email protected]           4.825.665 ops/sec

   [email protected]        3.729.880 ops/sec

   [email protected]     1.514.053 ops/sec

   [email protected]          1.229.999 ops/sec

   [email protected]       1.210.931 ops/sec

   [email protected]       481.073 ops/sec

```

### Deeply nested styles

The complex test with deeply nested single styles.

```js

c.green(

  `green ${c.cyan(

    `cyan ${c.red(

      `red ${c.yellow(

        `yellow ${c.blue(

          `blue ${c.magenta(`magenta ${c.underline(`underline ${c.italic(`italic`)} underline`)} magenta`)} blue`,

        )} yellow`,

      )} red`,

    )} cyan`,

  )} green`,

)

```

```diff

+  [email protected]      1.110.056 ops/sec

-  [email protected]      1.073.299 ops/sec

-> [email protected]             847.246 ops/sec  -23.7%

   [email protected]          847.110 ops/sec

-  [email protected]             573.942 ops/sec  -48.3%

   [email protected]             471.285 ops/sec

   [email protected]            439.588 ops/sec

   [email protected]       382.862 ops/sec

   [email protected]         213.351 ops/sec

   [email protected]        41.097 ops/sec

```

### Colorette bench

The benchmark used in [`colorette`](https://github.com/jorgebucaran/colorette/blob/main/bench/index.js) for single styles.

```js

c.red(`${c.bold(`${c.cyan(`${c.yellow('yellow')}cyan`)}`)}red`)

```

```diff

+  [email protected]      3.861.384 ops/sec

   [email protected]      3.815.039 ops/sec

-> [email protected]           2.918.269 ops/sec  -24.4%

   [email protected]        2.548.564 ops/sec

-  [email protected]           2.502.850 ops/sec  -35.2%

   [email protected]           2.229.023 ops/sec

   [email protected]     1.426.279 ops/sec

   [email protected]          1.123.139 ops/sec

   [email protected]         481.708 ops/sec

   [email protected]       114.570 ops/sec

```



### Picocolors complex bench

The [`picocolors`](https://github.com/alexeyraspopov/picocolors/blob/main/benchmarks/complex.mjs) benchmark, slightly modified.

Added a bit more complexity by applying two styles to the colored word instead of one.

```js

let index = 1e8;

c.red('.') +

c.yellow('.') +

c.green('.') +

c.red.bold(' ERROR ') +

c.red('Add plugin ' + c.cyan.underline('name') + ' to use time limit with ' + c.cyan(++index));

```

```diff

+  [email protected]      2.601.559 ops/sec

-> [email protected]           2.501.227 ops/sec   -3.8%

   [email protected]      2.326.491 ops/sec

-  [email protected]           2.129.106 ops/sec  -18.1%

   [email protected]           1.780.496 ops/sec

   [email protected]        1.685.703 ops/sec

   [email protected]       838.542 ops/sec

   [email protected]            533.362 ops/sec

   [email protected]         287.558 ops/sec

   [email protected]        97.463 ops/sec

```

> [!NOTE]

>

> In this test, which is closer to practical use, each library uses the **fastest** styling method available.

>

> So, `chalk`, `ansis`, `ansi-colors`, `cli-color`, `colors-cli` and `colors` uses chained method, e.g. `c.red.bold(' ERROR ')`.

> While `picocolors`, `colorette` and `kolorist` uses nested calls, e.g. `c.red(c.bold(' ERROR '))`, because doesn't support the chained syntax.

---

#### [↑ top](#top)



## How to switch to Ansis

Ansis is a powerful, small, and fast replacement that requires **no code migration** for many similar libraries.\

Just replace your `import ... from ...` or `require(...)` to `ansis`.



### Drop-in replacement for [chalk], no migration required

```diff

- import chalk from 'chalk';

+ import chalk from 'ansis';

```

Ansis supports the Chalk syntax and is compatible* with [styles and color names](https://github.com/chalk/chalk?tab=readme-ov-file#styles), so you don't need to modify the

original code:

```js

chalk.red.bold('Error!');

// colorize "Error: file not found!"

chalk.red(`Error: ${chalk.cyan.bold('file')} not found!`);

// ANSI 256 colors

chalk.ansi256(93)('Violet color');

chalk.bgAnsi256(194)('Honeydew, more or less');

// truecolor

chalk.hex('#FFA500').bold('Bold orange color');

chalk.rgb(123, 45, 67).underline('Underlined reddish color');

chalk.bgHex('#E0115F')('Ruby');

chalk.bgHex('#96C')('Amethyst');

```

> [!WARNING]

>

> Ansis doesn't not support the `overline` style, because it's **not widely supported** and no one uses it.\

> Check you code and remove the `overline` style:

>

> ```diff

> - chalk.red.overline('text');

> + chalk.red('text');

> ```

Optionally, you can rewrite the same code to make it even shorter and cleaner:

```js

import { red, cyan, fg, bg, hex, rgb, bgHex, bgRgb } from 'ansis';

red.bold('Error!'); // using parentheses

red.bold`Error!`;   // using template string

// colorize "Error: file not found!"

red`Error: ${cyan.bold`file`} not found!`;

// ANSI 256 colors

fg(93)`Violet color`; // alias for ansi256()

bg(194)`Honeydew, more or less`;  // alias for bgAnsi256()

// truecolor

hex('#FFA500').bold`Bold orange color`;

rgb(123, 45, 67).underline`Underlined reddish color`;

bgHex('#E0115F')`Ruby`;

bgHex('#96C')`Amethyst`;

```

#### [↑ top](#top)



### Drop-in replacement for [colorette], no migration required

```diff

- import { red, bold, underline } from 'colorette';

+ import { red, bold, underline } from 'ansis';

```

Ansis is fully compatible with `colorette` [styles and color names](https://github.com/jorgebucaran/colorette#supported-colors), so you don't need to modify the

original code:

```js

red.bold('Error!');

bold(`I'm ${red(`da ba ${underline("dee")} da ba`)} daa`);

```

Optionally, you can rewrite the same code to make it even shorter and cleaner:

```js

red.bold`Error!`;

bold`I'm ${red`da ba ${underline`dee`} da ba`} daa`;

```

#### [↑ top](#top)



### Drop-in replacement for [picocolors], no migration required

```diff

- import pico from 'picocolors';

+ import pico from 'ansis';

```

Ansis is fully compatible with `picocolors` [styles and color names](https://github.com/alexeyraspopov/picocolors#usage), so you don't need to modify the

original code:

```js

pico.red(pico.bold('text'));

pico.red(pico.bold(variable));

// colorize "Error: file not found!"

pico.red('Error: ' + pico.cyan(pico.bold('file')) + ' not found!');

```

Optionally, you can rewrite the same code to make it even shorter and cleaner:

```js

import { red, cyan } from 'ansis';

red.bold`text`;

red.bold(variable);

// colorize "Error: file not found!"

red`Error: ${cyan.bold`file`} not found!`

```

#### [↑ top](#top)



### Drop-in replacement for [ansi-colors], no migration required

```diff

- const c = require('ansi-colors');

+ const c = require('ansis');

```

Ansis is fully compatible with `ansi-color` [styles and color names](https://github.com/doowb/ansi-colors#available-styles), so you don't need to modify the

original code:

```js

c.red.bold('Error!');

// colorize "Error: file not found!"

c.red(`Error: ${c.cyan.bold('file')} not found!`);

```

Optionally, you can rewrite the same code to make it even shorter and cleaner:

```js

import { red, cyan } from 'ansis';

red.bold('Error!'); // using parentheses

red.bold`Error!`;   // using template string

// colorize "Error: file not found!"

red`Error: ${cyan.bold`file`} not found!`;

```

#### [↑ top](#top)



### Migration from [kleur]

```diff

- import { red, green, yellow, cyan } from 'kleur';

+ import { red, green, yellow, cyan } from 'ansis';

```

Ansis is fully compatible with `kleur` [styles and color names](https://github.com/lukeed/kleur#api),

but Kleur `v3.0` no longer uses Chalk-style syntax (magical getter):

```js

green().bold().underline('this is a bold green underlined message');

yellow(`foo ${red().bold('red')} bar ${cyan('cyan')} baz`);

```

If you uses chained methods then it requires a simple code modification.

Just replace `().` with `.`:

```js

green.bold.underline('this is a bold green underlined message');

yellow(`foo ${red.bold('red')} bar ${cyan('cyan')} baz`);

```

Optionally, you can rewrite the same code to make it even shorter and cleaner:

```js

yellow`foo ${red.bold`red`} bar ${cyan`cyan`} baz`;

```

#### [↑ top](#top)



### Migration from [cli-color]

```diff

- const clc = require('cli-color');

+ const clc = require('ansis');

```

Ansis is compatible* with `cli-color` [styles and color names](https://github.com/medikoo/cli-color#colors):

```js

clc.red.bold('Error!');

// colorize "Error: file not found!"

clc.red(`Error: ${c.cyan.bold('file')} not found!`);

```

> [!WARNING]

>

> Ansis doesn't not support the `blink` style, because it's **not widely supported** and no one uses it.\

> Check you code and remove the `blink` style:

>

> ```diff

> - clc.red.blink('text');

> + clc.red('text');

> ```

If you use ANSI 256 color functions, replace `xterm` with `fg` and `bgXterm` replace `bg`:

```diff

- clc.xterm(202).bgXterm(236)('Orange text on dark gray background');

+ clc.fg(202).bg(236)('Orange text on dark gray background');

```

Optionally, you can rewrite the same code to make it even shorter and cleaner:

```js

import { red, cyan, fg, bg } from 'ansis';

red.bold`Error!`;

// colorize "Error: file not found!"

red`Error: ${cyan.bold`file`} not found!`;

fg(202).bg(236)`Orange text on dark gray background`;

```

---

#### [↑ top](#top)

## Testing

`npm run test` will run the unit and integration tests.\

`npm run test:coverage` will run the tests with coverage.

---

#### [↑ top](#top)

## License

[ISC](https://github.com/webdiscus/ansis/blob/master/LICENSE)

[colors.js]: https://github.com/DABH/colors.js

[colorette]: https://github.com/jorgebucaran/colorette

[picocolors]: https://github.com/alexeyraspopov/picocolors

[cli-color]: https://github.com/medikoo/cli-color

[colors-cli]: https://github.com/jaywcjlove/colors-cli

[ansi-colors]: https://github.com/doowb/ansi-colors

[kleur]: https://github.com/lukeed/kleur

[kolorist]: https://github.com/marvinhagemeister/kolorist

[chalk]: https://github.com/chalk/chalk

[ansis]: https://github.com/webdiscus/ansis

[tinyrainbow]: https://github.com/tinylibs/tinyrainbow

[npm-colors.js]: https://www.npmjs.com/package/@colors/colors

[npm-colorette]: https://www.npmjs.com/package/colorette

[npm-picocolors]: https://www.npmjs.com/package/picocolors

[npm-cli-color]: https://www.npmjs.com/package/cli-color

[npm-colors-cli]: https://www.npmjs.com/package/colors-cli

[npm-ansi-colors]: https://www.npmjs.com/package/ansi-colors

[npm-kleur]: https://www.npmjs.com/package/kleur

[npm-kolorist]: https://www.npmjs.com/package/kolorist

[npm-chalk]: https://www.npmjs.com/package/chalk

[npm-ansis]: https://www.npmjs.com/package/ansis

[npm-tinyrainbow]: https://www.npmjs.com/package/tinyrainbow
ecosyste.ms

Data

Tools

Indexes

Applications

Experiments

Awesome

https://github.com/webdiscus/ansis

Awesome Lists containing this project

README

[ANSI S]tyles
