If you want to add emoji in your VS Code markdown that is supported by GitHub too, then this is the right article for you.
VS Code provides us with various extension to add various tools to support our development workflow. So here, we will see how to add emoji in our markdown with VSCode plugins.
Both extensions were created by Matt Bierner.
First, install Mardown Emoji from VS Code extension section.
To use any emoji in your markdown, type a colon (
: ) along with the name of the emoji and close the colon. For example for blush emoji (:blush:), type
However, one thing I didn't like about this extension is that it doesn't show to preview of the emoji as we type. We have to preview the whole document to see the emoji.
The emojiosense is better than the markdown emoji because it shows the preview of the emoji as we type it in our markdown.
It also gives a list of autocomplete suggestions as we type the name of emojis.
Adding emoji as same as the above plugin.
First, install the emojisense extension in Vscode and then type the name of the emoji you want between two colons, like this
It displays a small preview of the emoji next to it.
List of all the emoji : Github Markdown Emoji
This emoji is supported by GitHub too, so you can use it in your Github readme file too.
To preview your markdown document in VS Code, we have to right-click the document in the sidebar navigation and Click Open Preview. Or you can use the keyboard shortcut,
Ctrl + Shift +V
Once done, you can convert your markdown to any format like PDF, word,etc in VS Cide too. Read How to convert markdown files to PDF in VSCode