← Back to Blog

Paste Image - Favourite VS Code Extensions

I discovered this extension through the Foam recommended extensions

You can find Paste Image on VS Code Marketplace

This extension allows you to paste images directly into your code in any format you want.

The image in the clipboard is saved as a .png into my /public/images folder (where Next.js wants it) and inserts a Markdown image tag like this:

![](/images/vscode-paste-image_2021-06-07-01-17-30.png)

I have configured this locally to the workspace (instead of globally) because each project will have different requirements about where to serve images and how to reference them.

json
1{
2 "pasteImage.path": "${projectRoot}/public/images",
3 "pasteImage.basePath": "/images",
4 "pasteImage.namePrefix": "${currentFileNameWithoutExt}_",
5 "pasteImage.insertPattern": "![](/images/${imageFileName})"
6}
7

Want news and updates?

Join a handful of people who get my latest content and product updates, directly to your inbox.