DEV Community

Cover image for How to add Color to your code snippets using markdown
Jima Victor
Jima Victor

Posted on

How to add Color to your code snippets using markdown

Which one of these look better?
this?πŸ‘‡

function printHello() {
 console.log("Hello"); // prints hello to the console..
}
Enter fullscreen mode Exit fullscreen mode

or this..πŸ‘‡

function printHello() {
 console.log("Hello"); // prints hello to the console..
}
Enter fullscreen mode Exit fullscreen mode

That's right! The code snippet with colors definitely looks better and there are many advantages of using this feature built into text editors.

This feature that enables us to add colors to our code is known as syntax highlighting and it makes it easier and more enjoyable to read and understand code.

How to add syntax hightlighting in markdown

This is actually very easy to implement. All you have to do is add the name of the the programming language after the backticks in your markdown editor.
like thisπŸ‘‡



```javascript
function printHello() {
 console.log("Hello"); // prints hello to the console..
}
```


and viola! You're done!!

Make the world beautiful today by adding some color to it😊
Happy New Year CodersπŸŽ‰πŸŽ‰πŸŽ‰..

Top comments (3)

Collapse
 
hanytaha61 profile image
Hany Taha

Thanks. That was very useful.

Collapse
 
gustavupp profile image
Gus Pear 🍐 • Edited

Thanks Jima!! That is going to be really helpful

Collapse
 
jimajs profile image
Jima Victor

I'm glad you found it useful. Thanks for reading!