DEV Community

Cover image for Can you style console.log() in JavaScript
capscode
capscode

Posted on • Updated on • Originally published at capscode.in

Can you style console.log() in JavaScript

Hello Devs,

Is it possible to style cosole.log() in JavaScript ?
Its YES.

Have you ever tried this ?
If No, then lets do it together in these 2 simple steps.

  1. Add %c before the text you want to style.
  2. Insert one more argument in the console log function with the style you want to apply.

Do Checkout some of these examples:

console.log(`I LOVE 💜 %c${name}`, 'color: green')
Enter fullscreen mode Exit fullscreen mode

will produce

Alt Text

console.log(`I LOVE 💜 %c${name}`, 'color: red; font-size: 50px')
Enter fullscreen mode Exit fullscreen mode

will produce

Alt Text

console.log(`%cI LOVE 💜 %c${name}`, 'color: red; font-size: 50px')
Enter fullscreen mode Exit fullscreen mode

will produce

Alt Text

If you liked this, please let me know in the comment.

Thanks,

CapsCode

Discussion (3)

Collapse
lpyexplore profile image
Lpyexplore

Hello, I am a front-end enthusiast and I am from China. I just read your article and think it is very good. So I want to translate your article into Chinese and publish it on a Chinese blog site. I have nearly 20,000 fan readers. I want to share your article with more people. I want to ask for your information. Opinion, can I do this? Hope to get your reply

Collapse
capscode profile image
capscode Author

Yes Sure you can do this.
If you can give credit to us then it will be great for us as well.
😃😃😃😃
emojis copied from: myemoji.ml/

Collapse
joelpatrizio profile image
Joel Patrizio

Hi, can I see the blog site? I'm learning Chinese and I think it could be fun to take a look, even if my language skills are still pretty basic. Thanks!