Jacob Paris
← Back to all content

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:

md
![](/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
{
"pasteImage.path": "${projectRoot}/public/images",
"pasteImage.basePath": "/images",
"pasteImage.namePrefix": "${currentFileNameWithoutExt}_",
"pasteImage.insertPattern": "![](/images/${imageFileName})"
}
Professional headshot
Moulton
Moulton

Hey there! I'm a developer, designer, and digital nomad building cool things with Remix, and I'm also writing Moulton, the Remix Community Newsletter

About once per month, I send an email with:

  • New guides and tutorials
  • Upcoming talks, meetups, and events
  • Cool new libraries and packages
  • What's new in the latest versions of Remix

Stay up to date with everything in the Remix community by entering your email below.

Unsubscribe at any time.