@open-tech-world/ansi-styles

Ansi Styles

⚡ by Open Tech World

Style your text using ANSI escape sequences.

Features

✔️ 24-Bit Colors (True Color)

✔️ Nested Styles

✔️ Supports browser dev tools console (Currently chrome & edge browsers only)

Supported Styles

✔️ Foreground Colors

✔️ Background Colors

✔️ Bold

✔️ Dim

✔️ Italic

✔️ Underline

✔️ Inverse

✔️ Strikethrough

Installation

Using npm

npm install @open-tech-world/ansi-styles

Using Yarn

yarn add @open-tech-world/ansi-styles

Usage

import { style } from '@open-tech-world/ansi-styles';

style('~styleName[.styleName...]{Text}');

Examples

Using foreground color name

console.log(style('I like 🍊 ~orange{oranges}'));

Using multiple colors

console.log(
  style(
    'An ~red{apple} is red but the ~green{leaves} are green, came in a blue ~blue{box}'
  )
);

Nested colors

console.log(
  style(
    '~blue{This is a long blue text with some ~red{red} & ~green{green} color in it}'
  )
);

Composing different styles

console.log(style('~bold.white.bgGreen{ PASS }'));

Inverse colors

console.log(style('~inverse.red.bgWhite{ FAILED }'));

Faint, decreased intensity, or dim text

console.log(style('~dim{TEXT}'));

Italic fonts

console.log(style('~italic.fuchsia.bold.bgWhite{ Beautiful Text }'));

Underlined texts

console.log(
  style('Highlighted fruits: ~underline{Apple}, cat, ~underline{Banana}')
);

Strikethrough text

console.log(style('~strike.red{Deleted file.ext}'));

Custom functions

function warning(str) {
  return style(`⚠️  ~bold.black.bgYellow{${str}}`);
}

console.log(warning(' CAUTION '));

Style names

• Colors

  Foreground Colors	Background Colors
  blue	bgBlue
  red	bgRed
  green	bgGreen
  orange	bgOrange
  navy	bgNavy
  aqua	bgAqua
  teal	bgTeal
  purple	bgPurple
  fuchsia	bgFuchsia
  maroon	bgMaroon
  yellow	bgYellow
  olive	bgOlive
  lime	bgLime
  black	bgBlack
  gray	bgGray
  silver	bgSilver
  white	bgWhite

• rgb(red, green, blue)

• bgRgb(red, green, blue)

• Modifiers

  • bold
  • dim
  • italic
  • underline
  • inverse
  • strike

References

https://en.wikipedia.org/wiki/ANSI_escape_code

https://developer.chrome.com/docs/devtools/console/format-style/

License

Copyright (c) 2022, Thanga Ganapathy (MIT License).