Styled Console Logging

By Nethru Limited (www.nethru.com)

Recently, I found an interesting thing when displaying console logging. We can add styles to the console logging message. I have tried they are working on Chrome Developer Tools and Firebug.

Here is the method, just add %c in your logging message and input the style in the second parameter. The styles syntax are just the common CSS styles. So, you can control the font size, color, background, font family as you like.

console.log("%cYour Message!", "The CSS styles.");

Here is the sample output.

You can also use different styles for different text. Just add %c to any words you would like to have styles and add the CSS styles in the following parameters.

Facebook also added a styled console logging message as a warning message. Here is the sample.