Free
While you build and test.
$0
- On localhost, private networks, and .test or .local names
- No key and no sign-up
Add a photo and video editor to your own website.
It’s a JavaScript image and video editor SDK, with components for React, Vue, Svelte, and Angular. Your visitors fix their photos and videos right on your page, before they upload, and your site gets the finished file. It all runs in their browser, so nothing passes through our servers.
What your visitors can do
Photos
Opens JPG, PNG, WebP, AVIF, HEIC, GIF, BMP, TIFF, and SVG, and saves JPG, PNG, or WebP.
- Crop freely or to a shape such as 1:1, 4:5, or 16:9, or to your own sizes for avatars and banners.
- Turn in quarter turns, or straighten with a slider that keeps the crop level with no empty corners.
- Flip across or up and down.
- Pixelate or blur faces, number plates, or text, or the whole photo.
- Black and white, or inverted colors.
- Save at an exact width and height in pixels.
Videos
Opens MP4, MOV, WebM, and MKV, and saves in the video’s own format where it can, otherwise MP4.
- Keep one part of a video, or several parts joined back to back.
- Crop, turn, flip, and resize with the same tools as photos.
- Take the sound out.
- Saved at no more than the video’s own quality.
On your site
One JavaScript library from our CDN or npm, in plain HTML or with React, Vue, Svelte, or Angular.
- Takes on your site’s colors, corners, and font, in light and dark.
- Sits inside your page, or opens over it.
- Show only the tools you want, and the crop shapes and sizes that fit your site.
- Undo and redo, and edits that can be saved and opened again later.
- Works on phones and computers, in Chrome, Edge, Firefox, and Safari.
Add it to your site
Load the script
Import it from our CDN at a fixed version, or install @mastershot/editor from npm, and give it a box with a height. There are components for React, Vue, Svelte and Angular, and it works in plain HTML too.
Take the edited file
When your visitor presses Done, the process event hands you the edited file. Upload it, show it, or let the editor post it to your server.
Add your key when you go live
Build and test on localhost for free. Before the editor goes on a live domain, buy a plan, add your domain to its key, and pass the key as
licenseKey.
html
<div id="editor" style="height: 600px"></div>
<script type="module">
import { appendDefaultEditor } from
"https://cdn.mastershot.app/editor/1.8.0/editor.js"
const editor = appendDefaultEditor("#editor", {
src: file, // a File, a Blob, or a URL
licenseKey: "MSE-…", // on a live site
})
editor.on("process", ({ dest }) => upload(dest))
</script>Free while you build, then one yearly price for your company.
Every plan has the whole editor and covers every developer on your team. You only need a license key once it’s on a live site.
Indie
For a company with under $100K a year in revenue or funding.
$129 a year
- Up to 2 domains
- Everyone on your team
Business
For any company.
$490 a year
- Up to 5 domains
- Everyone on your team
Enterprise
For many sites, or a copy on your own servers.
$1,490 a year
- Any number of domains
- Everyone on your team
- A self-hosted copy on request
- Versions released while you subscribe keep working after you stop.
- A domain covers its subdomains, so example.com covers www and shop.
- Prices in US dollars. Polar handles the payment, tax, and invoice.
- Your key comes straight after you pay, with the steps to go live.
Questions
No. The editor opens and saves files in your visitor’s browser, and nothing goes to Mastershot. Your page gets the edited file and decides where it goes.
Current Chrome, Edge, Firefox, and Safari, on computers and phones. Your site doesn’t need any special server headers for it.
The editor still opens and edits, with a thin line above it saying it’s unlicensed, but every photo and video it saves has “Unlicensed Mastershot editor” written across the middle.
The versions released while you subscribed keep working on your domains. Newer versions are unlicensed until you subscribe again.
A few lines of code. Load one script from our CDN or install it from npm, with no server to run. It works in plain HTML or any framework, inside your page or opened over it. The docs show how.
Polar shows your license key and emails it to you, then sends you to a page that checks it and gives you the code with your key in it. There you sign in with the email you bought with and add your domains. The key works only on those, so nobody else can use it.
With Enterprise, yes. Email [email protected] and we’ll set it up.
Email [email protected]. If a photo or video won’t open in the editor, send it if you can, and we’ll make it work.
Sample photos from Tears of Steel and video from Big Buck Bunny, © Blender Foundation, under CC BY 3.0.