DEV Community

Cover image for Sick Console Bro! How To Style Your console.log with CSS

Sick Console Bro! How To Style Your console.log with CSS

Jack Harner πŸš€ on June 17, 2019

Originally Posted On Harner Designs | Photo by Glenn Carstens-Peters on Unsplash In Chrome and Firefox (>31) you can add CSS styles to your con...
Collapse
 
azza85 profile image
aaron

Nice one I've seen this on a couple of sites but had never looked into how to do it

Collapse
 
jackharner profile image
Jack Harner πŸš€

I don't think I've ever stumbled across a styled console like this in the wild yet. At least not that I can remember.

I see ASCII Art all the time though. I.e. from Facebook:

Dev.to does it as well!

Collapse
 
daviddalbusco profile image
David Dal Busco

Not sure anyone still use IE <= v9 but if so, it would need the workaround described by Andy E on stackoverflow.com/questions/547293... in order to print to the console

Collapse
 
daviddalbusco profile image
David Dal Busco • Edited

Oh and of course a screenshot of our upcoming open source editor for presentations πŸ˜‰

Collapse
 
ijason profile image
Jason

This is awesome! Thanks for sharing

Collapse
 
jackharner profile image
Jack Harner πŸš€

No problem!

Collapse
 
ben profile image
Ben Halpern
Collapse
 
jackharner profile image
Jack Harner πŸš€

Love it!