Skip to content
| Marketplace
Sign in
Visual Studio Code>Other>MarkdownDropNew to Visual Studio Code? Get it now.
MarkdownDrop

MarkdownDrop

GitButler

|
2 installs
| (0) | Free
Drop images into Markdown files to add S3 links to markdown
Installation
Launch VS Code Quick Open (Ctrl+P), paste the following command, and press enter.
Copied to clipboard
More Info

MarkdownDrop

This is a very simple VSCode extension that allows you to drag and drop files into a Markdown document, which uploads them into an S3 bucket and inserts that URL as the image.

Setup

You need to have a ~/.markdowndrop.json file with the following structure:

{
  "endpoint": "https://s3.us-east-1.amazonaws.com",
  "region": "us-east-1",
  "bucketName": "your-bucket-name",
  "accessKeyId": "your-access-key-id",
  "secretAccessKey": "your-secret-access-key",
  "cdn": "https://${bucket}.${region}.s3.amazonaws.com/${pathname}/${filepath}",
  "imageTagTemplate": "<ImageSection className=\"mx-auto\" src=\"${url}\" subtitle=\"${filename}\" />" # (optional - defaults to markdown syntax)
}

By default it will insert normal markdown syntax, but if you want something else, you can add the "imageTagTemplate" with optional $url and $filename variables. The example above will insert a custom React component.

Usage

Drag and drop a file into a Markdown document. It's important to hold down the shift key while dropping the file, otherwise VSCode will simply open the image.

License

This project is licensed under the MIT License. See the LICENSE.txt file for details

  • Contact us
  • Jobs
  • Privacy
  • Manage cookies
  • Terms of use
  • Trademarks
© 2025 Microsoft