DEV Community

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

Posted on • Edited 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

Top comments (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

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!