JavaScript - adding style to the text of console log [duplicate]

Addy Osmani has a good explanation:

https://plus.google.com/+AddyOsmani/posts/TanDFKEN9Kn (archive.org)

Styled console logging in the Chrome DevTools (Canary)

Thanks to Mr. +Mike West, you can now add style to your console log via %c, just like you can in Firebug. e.g

console.log("%cBlue!", "color: blue;"); 

Blocks such as console.log('%cBlue! %cRed!', 'color: blue;', 'color: red;'); are also now supported :)

Whilst most people will probably use this for practical purposes, it's also possible to have a little fun with it :) (see below)

Not to be outdone, here's what +Mike West came up with a few days ago

;)

Relevant change: http://trac.webkit.org/changeset/130941


Basically, you can use the %c paramater to pass in CSS styling. For an example, try the following in your chrome console:

console.log("%cBlue! %cGreen", "color: blue; font-size:15px;", "color: green; font-size:12px;");