Skip to content

Instantly share code, notes, and snippets.

@enten

enten/ansi-styles.js

Last active July 1, 2021 07:34
Show Gist options
  • Star 2 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save enten/cef219142ca6350cdd07ef6b58eb7636 to your computer and use it in GitHub Desktop.
Save enten/cef219142ca6350cdd07ef6b58eb7636 to your computer and use it in GitHub Desktop.
Download ZIP
Node JS ANSI Styles
Raw
ansi-styles.js
module.exports = []
.concat([
'reset',
'bold',
'dim',
'italic',
'underline',
'blink',
,
'inverse',
'hidden',
'strikethrough'
].reduce((acc, modifier, index) => {
acc.push([modifier, [
index,
22 + (index > 2 ? index - 2 : 0)
]])
return acc
}, []))
.concat([
'black',
'red',
'green',
'yellow',
'blue',
'magenta',
'cyan',
'white'
].reduce((acc, color, index) => {
const colorUpper = color[0].toUpperCase() + color.substring(1)
;[
30,
40
].forEach((code, i) => {
const name = ['', 'bg'][i] + (i ? colorUpper : color)
const open = code + index
const close = code + 9
acc.push(
[name, [open, close]],
[name + 'Bright', [open + 60, close]]
)
})
return acc
}, []))
// .map(([name, codes]) => [name, codes.map((x) => `\u001b[${x}m`)])
@enten
Copy link
Author

enten commented Aug 1, 2017 •
edited 

function decorateText (open, close, text) {
  return [open, text, close].join('')
}

const STYLE = {
  bold: decorateText.bind(null, '\u001b[1m', '\u001b[22m'),
  dim: decorateText.bind(null, '\u001b[2m', '\u001b[22m'),
  italic: decorateText.bind(null, '\u001b[3m', '\u001b[23m'),
  underline: decorateText.bind(null, '\u001b[4m', '\u001b[24m'),
  blink: decorateText.bind(null, '\u001b[5m', '\u001b[25m'),
  inverse: decorateText.bind(null, '\u001b[7m', '\u001b[27m'),
  hidden: decorateText.bind(null, '\u001b[8m', '\u001b[28m'),
  strikethrough: decorateText.bind(null, '\u001b[9m', '\u001b[29m'),
  black: decorateText.bind(null, '\u001b[30m', '\u001b[39m'),
  blackBright: decorateText.bind(null, '\u001b[90m', '\u001b[39m'),
  bgBlack: decorateText.bind(null, '\u001b[40m', '\u001b[49m'),
  bgBlackBright: decorateText.bind(null, '\u001b[100m', '\u001b[49m'),
  red: decorateText.bind(null, '\u001b[31m', '\u001b[39m'),
  redBright: decorateText.bind(null, '\u001b[91m', '\u001b[39m'),
  bgRed: decorateText.bind(null, '\u001b[41m', '\u001b[49m'),
  bgRedBright: decorateText.bind(null, '\u001b[101m', '\u001b[49m'),
  green: decorateText.bind(null, '\u001b[32m', '\u001b[39m'),
  greenBright: decorateText.bind(null, '\u001b[92m', '\u001b[39m'),
  bgGreen: decorateText.bind(null, '\u001b[42m', '\u001b[49m'),
  bgGreenBright: decorateText.bind(null, '\u001b[102m', '\u001b[49m'),
  yellow: decorateText.bind(null, '\u001b[33m', '\u001b[39m'),
  yellowBright: decorateText.bind(null, '\u001b[93m', '\u001b[39m'),
  bgYellow: decorateText.bind(null, '\u001b[43m', '\u001b[49m'),
  bgYellowBright: decorateText.bind(null, '\u001b[103m', '\u001b[49m'),
  blue: decorateText.bind(null, '\u001b[34m', '\u001b[39m'),
  blueBright: decorateText.bind(null, '\u001b[94m', '\u001b[39m'),
  bgBlue: decorateText.bind(null, '\u001b[44m', '\u001b[49m'),
  bgBlueBright: decorateText.bind(null, '\u001b[104m', '\u001b[49m'),
  magenta: decorateText.bind(null, '\u001b[35m', '\u001b[39m'),
  magentaBright: decorateText.bind(null, '\u001b[95m', '\u001b[39m'),
  bgMagenta: decorateText.bind(null, '\u001b[45m', '\u001b[49m'),
  bgMagentaBright: decorateText.bind(null, '\u001b[105m', '\u001b[49m'),
  cyan: decorateText.bind(null, '\u001b[36m', '\u001b[39m'),
  cyanBright: decorateText.bind(null, '\u001b[96m', '\u001b[39m'),
  bgCyan: decorateText.bind(null, '\u001b[46m', '\u001b[49m'),
  bgCyanBright: decorateText.bind(null, '\u001b[106m', '\u001b[49m'),
  white: decorateText.bind(null, '\u001b[37m', '\u001b[39m'),
  whiteBright: decorateText.bind(null, '\u001b[97m', '\u001b[39m'),
  bgWhite: decorateText.bind(null, '\u001b[47m', '\u001b[49m'),
  bgWhiteBright: decorateText.bind(null, '\u001b[107m', '\u001b[49m')
}
const STYLE = {
  reset: (txt) => '\u001b[0m' + txt + '\u001b[22m',
  bold: (txt) => '\u001b[1m' + txt + '\u001b[22m',
  dim: (txt) => '\u001b[2m' + txt + '\u001b[22m',
  italic: (txt) => '\u001b[3m' + txt + '\u001b[23m',
  underline: (txt) => '\u001b[4m' + txt + '\u001b[24m',
  blink: (txt) => '\u001b[5m' + txt + '\u001b[25m',
  inverse: (txt) => '\u001b[7m' + txt + '\u001b[27m',
  hidden: (txt) => '\u001b[8m' + txt + '\u001b[28m',
  strikethrough: (txt) => '\u001b[9m' + txt + '\u001b[29m',
  black: (txt) => '\u001b[30m' + txt + '\u001b[39m',
  blackBright: (txt) => '\u001b[90m' + txt + '\u001b[39m',
  bgBlack: (txt) => '\u001b[40m' + txt + '\u001b[49m',
  bgBlackBright: (txt) => '\u001b[100m' + txt + '\u001b[49m',
  red: (txt) => '\u001b[31m' + txt + '\u001b[39m',
  redBright: (txt) => '\u001b[91m' + txt + '\u001b[39m',
  bgRed: (txt) => '\u001b[41m' + txt + '\u001b[49m',
  bgRedBright: (txt) => '\u001b[101m' + txt + '\u001b[49m',
  green: (txt) => '\u001b[32m' + txt + '\u001b[39m',
  greenBright: (txt) => '\u001b[92m' + txt + '\u001b[39m',
  bgGreen: (txt) => '\u001b[42m' + txt + '\u001b[49m',
  bgGreenBright: (txt) => '\u001b[102m' + txt + '\u001b[49m',
  yellow: (txt) => '\u001b[33m' + txt + '\u001b[39m',
  yellowBright: (txt) => '\u001b[93m' + txt + '\u001b[39m',
  bgYellow: (txt) => '\u001b[43m' + txt + '\u001b[49m',
  bgYellowBright: (txt) => '\u001b[103m' + txt + '\u001b[49m',
  blue: (txt) => '\u001b[34m' + txt + '\u001b[39m',
  blueBright: (txt) => '\u001b[94m' + txt + '\u001b[39m',
  bgBlue: (txt) => '\u001b[44m' + txt + '\u001b[49m',
  bgBlueBright: (txt) => '\u001b[104m' + txt + '\u001b[49m',
  magenta: (txt) => '\u001b[35m' + txt + '\u001b[39m',
  magentaBright: (txt) => '\u001b[95m' + txt + '\u001b[39m',
  bgMagenta: (txt) => '\u001b[45m' + txt + '\u001b[49m',
  bgMagentaBright: (txt) => '\u001b[105m' + txt + '\u001b[49m',
  cyan: (txt) => '\u001b[36m' + txt + '\u001b[39m',
  cyanBright: (txt) => '\u001b[96m' + txt + '\u001b[39m',
  bgCyan: (txt) => '\u001b[46m' + txt + '\u001b[49m',
  bgCyanBright: (txt) => '\u001b[106m' + txt + '\u001b[49m',
  white: (txt) => '\u001b[37m' + txt + '\u001b[39m',
  whiteBright: (txt) => '\u001b[97m' + txt + '\u001b[39m',
  bgWhite: (txt) => '\u001b[47m' + txt + '\u001b[49m',
  bgWhiteBright: (txt) => '\u001b[107m' + txt + '\u001b[49m'
}

// Fix humans
STYLE.grey = STYLE.gray = STYLE.blackBright
STYLE.bgGrey = STYLE.bgGray = STYLE.bgBlackBright
const STYLE = {
  reset: (txt) => ['\u001b[0m', txt, '\u001b[22m'].join(''),
  bold: (txt) => ['\u001b[1m', txt, '\u001b[22m'].join(''),
  dim: (txt) => ['\u001b[2m', txt, '\u001b[22m'].join(''),
  italic: (txt) => ['\u001b[3m', txt, '\u001b[23m'].join(''),
  underline: (txt) => ['\u001b[4m', txt, '\u001b[24m'].join(''),
  blink: (txt) => ['\u001b[5m', txt, '\u001b[25m'].join(''),
  inverse: (txt) => ['\u001b[7m', txt, '\u001b[27m'].join(''),
  hidden: (txt) => ['\u001b[8m', txt, '\u001b[28m'].join(''),
  strikethrough: (txt) => ['\u001b[9m', txt, '\u001b[29m'].join(''),
  black: (txt) => ['\u001b[30m', txt, '\u001b[39m'].join(''),
  blackBright: (txt) => ['\u001b[90m', txt, '\u001b[39m'].join(''),
  bgBlack: (txt) => ['\u001b[40m', txt, '\u001b[49m'].join(''),
  bgBlackBright: (txt) => ['\u001b[100m', txt, '\u001b[49m'].join(''),
  red: (txt) => ['\u001b[31m', txt, '\u001b[39m'].join(''),
  redBright: (txt) => ['\u001b[91m', txt, '\u001b[39m'].join(''),
  bgRed: (txt) => ['\u001b[41m', txt, '\u001b[49m'].join(''),
  bgRedBright: (txt) => ['\u001b[101m', txt, '\u001b[49m'].join(''),
  green: (txt) => ['\u001b[32m', txt, '\u001b[39m'].join(''),
  greenBright: (txt) => ['\u001b[92m', txt, '\u001b[39m'].join(''),
  bgGreen: (txt) => ['\u001b[42m', txt, '\u001b[49m'].join(''),
  bgGreenBright: (txt) => ['\u001b[102m', txt, '\u001b[49m'].join(''),
  yellow: (txt) => ['\u001b[33m', txt, '\u001b[39m'].join(''),
  yellowBright: (txt) => ['\u001b[93m', txt, '\u001b[39m'].join(''),
  bgYellow: (txt) => ['\u001b[43m', txt, '\u001b[49m'].join(''),
  bgYellowBright: (txt) => ['\u001b[103m', txt, '\u001b[49m'].join(''),
  blue: (txt) => ['\u001b[34m', txt, '\u001b[39m'].join(''),
  blueBright: (txt) => ['\u001b[94m', txt, '\u001b[39m'].join(''),
  bgBlue: (txt) => ['\u001b[44m', txt, '\u001b[49m'].join(''),
  bgBlueBright: (txt) => ['\u001b[104m', txt, '\u001b[49m'].join(''),
  magenta: (txt) => ['\u001b[35m', txt, '\u001b[39m'].join(''),
  magentaBright: (txt) => ['\u001b[95m', txt, '\u001b[39m'].join(''),
  bgMagenta: (txt) => ['\u001b[45m', txt, '\u001b[49m'].join(''),
  bgMagentaBright: (txt) => ['\u001b[105m', txt, '\u001b[49m'].join(''),
  cyan: (txt) => ['\u001b[36m', txt, '\u001b[39m'].join(''),
  cyanBright: (txt) => ['\u001b[96m', txt, '\u001b[39m'].join(''),
  bgCyan: (txt) => ['\u001b[46m', txt, '\u001b[49m'].join(''),
  bgCyanBright: (txt) => ['\u001b[106m', txt, '\u001b[49m'].join(''),
  white: (txt) => ['\u001b[37m', txt, '\u001b[39m'].join(''),
  whiteBright: (txt) => ['\u001b[97m', txt, '\u001b[39m'].join(''),
  bgWhite: (txt) => ['\u001b[47m', txt, '\u001b[49m'].join(''),
  bgWhiteBright: (txt) => ['\u001b[107m', txt, '\u001b[49m'].join('')
}
[
  ['reset', [0, 22]],
  ['bold', [1, 22]],
  ['dim', [2, 22]],
  ['italic', [3, 23]],
  ['underline', [4, 24]],
  ['blink', [5, 25]],
  ['inverse', [7, 27]],
  ['hidden', [8, 28]],
  ['strikethrough', [9, 29]],
  ['black', [30, 39]],
  ['blackBright', [90, 39]],
  ['bgBlack', [40, 49]],
  ['bgBlackBright', [100, 49]],
  ['red', [31, 39]],
  ['redBright', [91, 39]],
  ['bgRed', [41, 49]],
  ['bgRedBright', [101, 49]],
  ['green', [32, 39]],
  ['greenBright', [92, 39]],
  ['bgGreen', [42, 49]],
  ['bgGreenBright', [102, 49]],
  ['yellow', [33, 39]],
  ['yellowBright', [93, 39]],
  ['bgYellow', [43, 49]],
  ['bgYellowBright', [103, 49]],
  ['blue', [34, 39]],
  ['blueBright', [94, 39]],
  ['bgBlue', [44, 49]],
  ['bgBlueBright', [104, 49]],
  ['magenta', [35, 39]],
  ['magentaBright', [95, 39]],
  ['bgMagenta', [45, 49]],
  ['bgMagentaBright', [105, 49]],
  ['cyan', [36, 39]],
  ['cyanBright', [96, 39]],
  ['bgCyan', [46, 49]],
  ['bgCyanBright', [106, 49]],
  ['white', [37, 39]],
  ['whiteBright', [97, 39]],
  ['bgWhite', [47, 49]],
  ['bgWhiteBright', [107, 49]]
]
[
  ['reset', ['\u001b[0m', '\u001b[22m']],
  ['bold', ['\u001b[1m', '\u001b[22m']],
  ['dim', ['\u001b[2m', '\u001b[22m']],
  ['italic', ['\u001b[3m', '\u001b[23m']],
  ['underline', ['\u001b[4m', '\u001b[24m']],
  ['blink', ['\u001b[5m', '\u001b[25m']],
  ['inverse', ['\u001b[7m', '\u001b[27m']],
  ['hidden', ['\u001b[8m', '\u001b[28m']],
  ['strikethrough', ['\u001b[9m', '\u001b[29m']],
  ['black', ['\u001b[30m', '\u001b[39m']],
  ['blackBright', ['\u001b[90m', '\u001b[39m']],
  ['bgBlack', ['\u001b[40m', '\u001b[49m']],
  ['bgBlackBright', ['\u001b[100m', '\u001b[49m']],
  ['red', ['\u001b[31m', '\u001b[39m']],
  ['redBright', ['\u001b[91m', '\u001b[39m']],
  ['bgRed', ['\u001b[41m', '\u001b[49m']],
  ['bgRedBright', ['\u001b[101m', '\u001b[49m']],
  ['green', ['\u001b[32m', '\u001b[39m']],
  ['greenBright', ['\u001b[92m', '\u001b[39m']],
  ['bgGreen', ['\u001b[42m', '\u001b[49m']],
  ['bgGreenBright', ['\u001b[102m', '\u001b[49m']],
  ['yellow', ['\u001b[33m', '\u001b[39m']],
  ['yellowBright', ['\u001b[93m', '\u001b[39m']],
  ['bgYellow', ['\u001b[43m', '\u001b[49m']],
  ['bgYellowBright', ['\u001b[103m', '\u001b[49m']],
  ['blue', ['\u001b[34m', '\u001b[39m']],
  ['blueBright', ['\u001b[94m', '\u001b[39m']],
  ['bgBlue', ['\u001b[44m', '\u001b[49m']],
  ['bgBlueBright', ['\u001b[104m', '\u001b[49m']],
  ['magenta', ['\u001b[35m', '\u001b[39m']],
  ['magentaBright', ['\u001b[95m', '\u001b[39m']],
  ['bgMagenta', ['\u001b[45m', '\u001b[49m']],
  ['bgMagentaBright', ['\u001b[105m', '\u001b[49m']],
  ['cyan', ['\u001b[36m', '\u001b[39m']],
  ['cyanBright', ['\u001b[96m', '\u001b[39m']],
  ['bgCyan', ['\u001b[46m', '\u001b[49m']],
  ['bgCyanBright', ['\u001b[106m', '\u001b[49m']],
  ['white', ['\u001b[37m', '\u001b[39m']],
  ['whiteBright', ['\u001b[97m', '\u001b[39m']],
  ['bgWhite', ['\u001b[47m', '\u001b[49m']],
  ['bgWhiteBright', ['\u001b[107m', '\u001b[49m']]
]
{
  reset: [0, 22],
  bold: [1, 22],
  dim: [2, 22],
  italic: [3, 23],
  underline: [4, 24],
  blink: [5, 25],
  inverse: [7, 27],
  hidden: [8, 28],
  strikethrough: [9, 29],
  black: [30, 39],
  blackBright: [90, 39],
  bgBlack: [40, 49],
  bgBlackBright: [100, 49],
  red: [31, 39],
  redBright: [91, 39],
  bgRed: [41, 49],
  bgRedBright: [101, 49],
  green: [32, 39],
  greenBright: [92, 39],
  bgGreen: [42, 49],
  bgGreenBright: [102, 49],
  yellow: [33, 39],
  yellowBright: [93, 39],
  bgYellow: [43, 49],
  bgYellowBright: [103, 49],
  blue: [34, 39],
  blueBright: [94, 39],
  bgBlue: [44, 49],
  bgBlueBright: [104, 49],
  magenta: [35, 39],
  magentaBright: [95, 39],
  bgMagenta: [45, 49],
  bgMagentaBright: [105, 49],
  cyan: [36, 39],
  cyanBright: [96, 39],
  bgCyan: [46, 49],
  bgCyanBright: [106, 49],
  white: [37, 39],
  whiteBright: [97, 39],
  bgWhite: [47, 49],
  bgWhiteBright: [107, 49]
}
{
  reset: ['\u001b[0m', '\u001b[22m'],
  bold: ['\u001b[1m', '\u001b[22m'],
  dim: ['\u001b[2m', '\u001b[22m'],
  italic: ['\u001b[3m', '\u001b[23m'],
  underline: ['\u001b[4m', '\u001b[24m'],
  blink: ['\u001b[5m', '\u001b[25m'],
  inverse: ['\u001b[7m', '\u001b[27m'],
  hidden: ['\u001b[8m', '\u001b[28m'],
  strikethrough: ['\u001b[9m', '\u001b[29m'],
  black: ['\u001b[30m', '\u001b[39m'],
  blackBright: ['\u001b[90m', '\u001b[39m'],
  bgBlack: ['\u001b[40m', '\u001b[49m'],
  bgBlackBright: ['\u001b[100m', '\u001b[49m'],
  red: ['\u001b[31m', '\u001b[39m'],
  redBright: ['\u001b[91m', '\u001b[39m'],
  bgRed: ['\u001b[41m', '\u001b[49m'],
  bgRedBright: ['\u001b[101m', '\u001b[49m'],
  green: ['\u001b[32m', '\u001b[39m'],
  greenBright: ['\u001b[92m', '\u001b[39m'],
  bgGreen: ['\u001b[42m', '\u001b[49m'],
  bgGreenBright: ['\u001b[102m', '\u001b[49m'],
  yellow: ['\u001b[33m', '\u001b[39m'],
  yellowBright: ['\u001b[93m', '\u001b[39m'],
  bgYellow: ['\u001b[43m', '\u001b[49m'],
  bgYellowBright: ['\u001b[103m', '\u001b[49m'],
  blue: ['\u001b[34m', '\u001b[39m'],
  blueBright: ['\u001b[94m', '\u001b[39m'],
  bgBlue: ['\u001b[44m', '\u001b[49m'],
  bgBlueBright: ['\u001b[104m', '\u001b[49m'],
  magenta: ['\u001b[35m', '\u001b[39m'],
  magentaBright: ['\u001b[95m', '\u001b[39m'],
  bgMagenta: ['\u001b[45m', '\u001b[49m'],
  bgMagentaBright: ['\u001b[105m', '\u001b[49m'],
  cyan: ['\u001b[36m', '\u001b[39m'],
  cyanBright: ['\u001b[96m', '\u001b[39m'],
  bgCyan: ['\u001b[46m', '\u001b[49m'],
  bgCyanBright: ['\u001b[106m', '\u001b[49m'],
  white: ['\u001b[37m', '\u001b[39m'],
  whiteBright: ['\u001b[97m', '\u001b[39m'],
  bgWhite: ['\u001b[47m', '\u001b[49m'],
  bgWhiteBright: ['\u001b[107m', '\u001b[49m']
}

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment