In this blog, we are going to use the npm
chalk to make our console colorful and beautiful. This package is purely built for the purpose of the console colorful logs in the terminal. The package can be installed using the command
npm install chalk.
After installing you can import or require in your project.
const chalk = require(‘chalk’)
console.log(chalk.color_name(“String to be printed in terminal”));
Here, the list of color_name supported by the chalk package. Colors that can be specified through keywords are:
black,red, green, yellow, blue, magenta, cyan, white, blackBright (alias: gray, grey), redBright, greenBright, yellowBright, blueBright, magentaBright, cyanBright, whiteBright.
We can also add color in text background,
Example-:console.log(chalk.bg<Color>(“String to be printed in terminal ”));
The list of background colors supported by chalk are
bgBlack, bgRed, bgGreen, bgYellow, bgBlue, bgMagenta, bgCyan, bgWhite, bgBlackBright (alias: bgGray, bgGrey), bgRedBright, bgGreenBright, bgYellowBright, bgBlueBright, bgMagentaBright, bgCyanBright, bgWhiteBright.
We can also modify our text, such that bold, italic, etc
Example:-console.log(chalk.<modifier>(“String to be printed in terminal ”));
The list of modifiers used to modify the text to the styles which are supported by npm chalk are
reset– Resets the current colour chain.
bold– Make text bold.
dim– Emitting only a small amount of light.
italic– Make text italic. (Not widely supported)
underline– Make text underline. (Not widely supported)
inverse– Inverse background and foreground colours.
hidden– Prints the text, but makes it invisible.
strikethrough– Puts a horizontal line through the centre of the text. (Not widely supported)
visible– Prints the text only when Chalk has a colour level > 0. Can be useful for things that are purely cosmetic.
Have you thought about chaining all properties in chalk to make better output? yes, we can chain all properties. look at the below example.
We can also define our own themes.
const error = chalk.bold.red;
const warning = chalk.yellowBright
Let’s see an example, how to make our own themes and use them across our project
Setting the level property you can override the colour. Basically, it is supported automatically by chalk. You should however only do this in your own code as it applies globally to all Chalk consumers.
There are 4 levels of colour support for npm chalk.
||All colours disabled|
||Basic colour support (16 colours)|
||256 colour support|
||Truecolor support (16 million colours)|
Detect whether your terminal supports color. colour can be overridden by using flags
--no-color. You can forcefully use colour by using
FORCE_COLOR=1 (level 1),
FORCE_COLOR=2 (level 2), or
FORCE_COLOR=3 (level 3) to forcefully enable colour, or
FORCE_COLOR=0 to forcefully disable.
suppose we want to print only some part of the string colourful. We can define styles by using template literals and then using chalk to make them colourful.
This npm package truly went to the front when the shortages good terminal c were uncovered. To sum up, this is an exceptionally flexible and simple to utilize chalk to style your control centre. This bundle likewise draws near to 50M downloads each week! All things considered, which is all well and good. With the components depicted over, it’s hard to dislike and utilizes this bundle! Happy coding!
If you are interested in such a blog then please do subscribe to our blog for the upcoming blog.
Some links related to chalk.