1. Snippets
  2. ›
  3. JavaScript
  4. ›
  5. Colors in JavaScript Console

Colors in JavaScript Console

To style the logs, you should place “%c” within the first argument of console.log(). It will pick up the next argument as a CSS style for the “%c” pattern argument text.

console.log('%c Hi everyone!', 'color: #1c87c9; font-size: 18px');

If you want to add multiple style, you should add multiple “%c” text and add style arguments:

console.log('%Style 1! %Style 2!',
  'color: #1c87c9; background: #ccc; font-size: 20px;', 
  'color: #8ebf42; background: # 666; font - size: 20 px;'
);
If you want to highlight errors in red, you can simply use the console.error() function instead of console.log(), and console.warn() to highlight warning in orange.

The console.log() Method

The console.log() method outputs a message to the web console. The message may be either a single string or JavaScript objects. The console.log() function is mostly used for debugging purposes as it makes JavaScript print the output to the console.

Related Resources

Do you find this helpful?

Related articles