Ansis
CJS/ESM ANSI color library for terminals, CI and Chromium-based browser consoles. Compatible with Bun, Deno, Next.JS.
Install / Use
/learn @webdiscus/AnsisREADME
<a name="top"></a>
<div align="center"> <a href="https://www.npmjs.com/package/ansis"> <img width="322" src="https://github.com/webdiscus/ansis/raw/master/docs/img/logo2.png" alt="ansis"> </a> <br> <i>Make terminals a little more colorful 🌈</i> <h1 align="center">[ANSI S]tyles</h1> </div>
ANSI color library for use in terminals, CI environments, and Chromium-based browsers.
Ansis is focused on small size and speed while providing rich functionality and handling edge cases.
// Named imports - for cleaner, more readable code
import { red, cyan, bold, hex, rgb } from 'ansis';
// Clean chained syntax with template literals - no extra parentheses
console.log(bold.bgRed` FAIL `);
// Nested templates - no string concatenation needed
console.log(red`✖ Error: ${cyan`file.js`} not found`);
// Truecolor: hex and rgb
console.log(hex('#FF75D1').bold`Pink`);
console.log(rgb(224, 17, 95).italic`Ruby`);
🔗 Shortcuts
🚀 Getting Started 📌 Ansis vs styleText() 🔄 Migrating from ⚖️ Alternatives
⚙️ Compatibility 🔧Troubleshooting 🧪 CLI Testing
🔔 Upgrading to v4 · New features · Breaking changes
⭐️ Star History
✨ Highlights
🎨 Colors - 16 · 256 · Truecolor (hex/rgb) · Named colors (orange, pink ...)
✍️ Syntax - Chained · Template literals · Nested templates
⚙️ Works - ESM · CJS · TS · Node 10+ · Bun · Deno · CI · Chromium browsers
🧠 Smart - Auto color detection · Fallback (truecolor → 256 → 16 → b&w) · NO_COLOR · FORCE_COLOR
📦 Tiny - 5.8 kB · Drop-in replacement for Chalk (44 kB)
⚡ Performance
Ansis is the fastest when using 2 or more styles, which is the common real-world use case.
| Library | 1 style | 2+ styles |
|------------------|-----------------:|----------------:|
| ansis | 60M ops/sec | 🏆 60M ops/sec |
| picocolors | 🏆 109M ops/sec | 58M ops/sec |
| chalk | 55M ops/sec | 47M ops/sec |
| util.styleText | 0.5M ops/sec | 0.5M ops/sec |
<a name="features"></a>
💡 Features
🎨 Colors & Styles
- ANSI styles:
dimbolditalic<u>underline</u> <s>strikethrough</s> ... - ANSI 16 colors:
redredBrightbgRedbgRedBright... - ANSI 256 colors:
fg(n)bg(n) - Truecolor:
hex('#FF75D1')rgb(224, 17, 95)bgHex()bgRgb() - Named truecolors:
orange()bgPink()... - viaextend()
✍️ Syntax
- Chained styles:
red.bold.underline- no nested calls likered(bold(underline())) - Template literals:
red`text`- no parentheses - Nested templates:
red`Error: ${cyan`file.js`} not found`- no string concatenations
🛠️ Utilities
- Strip ANSI codes:
ansis.strip(red('text'))→ plain'text' - Raw escape codes:
open/close-`${red.open}Error${red.close} file not found`
💻 Environment
- Auto color detection + Fallback: Truecolor → 256 → 16 → b&w
- ENV variables:
NO_COLORFORCE_COLORCOLORTERM - CLI flags:
--no-color--color - CLI testing: force color levels in tests
⚙️ Compatibility
- ESM · CJS · TypeScript · Bun · Deno · Next.js · CI (GitHub and others)
- Chromium browsers: Chrome · Edge · Opera · Brave · Vivaldi
- Drop-in replacement for
chalkansi-colorscoloretteand others
🎯 You might also like
flaget- CLI argument parsing. A smaller (5 kB) and faster alternative toyargs-parser(85 kB)HTML bundler- Plugin for Webpack to generate static sites from templates (html, ejs, hbs, pug, ...)
<a name="alternatives"></a>
⚖️ Alternatives
[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]
Since Node.js 22 supports ANSI styling natively via util.styleText(), it is recommended for simple use cases where 16 colors are enough and top performance is not critical.
See styleText() limitations.
✅ Compare features 📊 Benchmarks 🧩 Handling edge cases
Install
npm install ansis
For Node.js 10–12+ use special build
npm install ansis@node10
<a name="getting-started"></a>
Usage
ESM
import ansis, { red, bold, fg, hex, rgb } from 'ansis';
CJS
const ansis = require('ansis');
const { red, bold, fg, hex, rgb } = require('ansis');
<a name="chained-syntax"></a>
Chained syntax
All colors, styles and functions are chainable. Each color or style can be combined in any order.
import { red, bold, hex } from 'ansis';
red.bold`text`;
hex('#FF75D1').bgCyan.bold`text`;
bold.hex('#FF75D1').bgCyan`text`;
<a name="template-literals"></a> <a name="nested-templates"></a>
Template literals
Omit parentheses to keep your code clean:
import { red, yellow, green } from 'ansis';
red`Error`; // no parentheses
red`Red ${yellow`Yellow ${green`Green`} Yellow`} Red`; // deep nested templates
Escape sequences work exactly as in regular strings:
red`Hello\nWorld`; // two lines in red
red`prev\\next`; // one line: prev\next
↑ top
<a name="styles"></a>
ANSI Styles
dim bold italic <u>underline</u> <s>strikethrough</s> inverse visible hidden reset
<a name="base-colors"></a>
ANSI 16 colors
There are 16 basic colors: 8 standard and 8 bright variants.
| Example | Color | Background | Bright Example | Bright Color | Bright Background |
|:---------------------------------:|:---------------|:--------------------|:---------------------------------------:|:----------------|:------------------|
| 
| black | bgBlack | 
| gray | bgGray |
| 
| red | bgRed | 
| redBright | bgRedBright |
| 
| green | bgGreen | 
| greenBright | bgGreenBright |
| 
| yellow | bgYellow | 
| yellowBright | bgYellowBright |
| 
| blue | bgBlue | 
| blueBright | bgBlueBright |
| 
| magenta | bgMagenta | 
| magentaBright | bgMagentaBright |
| 
| cyan | bgCyan | 
| cyanBright | bgCyanBright |
| 
| white | bgWhite | 
| whiteBright | bgWhiteBright |
<a name="256-colors"></a>
ANSI 256 colors
- Foreground:
fg(code)-chalk.ansi256(code)equivalent - Background:
bg(code)-chalk.bgAnsi256(code)equivalent
import { bold, fg, bg } from 'ansis';
fg(96)`Bright Cyan`;
bg(105).fg(96)`Cyan text on magenta background`;
bold.fg(96).underline`Bold underline Bright Cyan`;
256 color codes
<div align="center"> <a href="https://www.npmjs.com/package/ansis"> <img width="830" src="https://github.com/webdiscus/ansis/raw/master/docs/img/ansi256.png" alt="ANSI 256 colors"> </a> </div>See ANSI color codes.
Fallback
If a terminal supports only 16 colors then ANSI 256 colors will be interpolated into base 16 colors.
<div align="center"> <a href="https://www.npmjs.com/package/ansis"> <img width="830" src="https://github.com/webdiscus/ansis/raw/master/docs/img/ansi256-fallback.png" alt="Fallback ANSI 256 colors to 16 colors"> </a> </div><a name="truecolor"></a>
Truecolor
- Foreground:
hex()rgb() - Background:
bgHex()bgRgb()
import { bold, hex, rgb, bgHex } from 'ansis';
hex('#E0115F').bold`Bold Ruby`;
rgb(224, 17, 95).italic`Italic Ruby`;
bold.h
