Svelte image editor starter

A ready-made Svelte app with a full image editor in it, built with the Layermetry media editor SDK. An image editor with templates, text, shapes, stickers, backgrounds and filters, which exports PNG, JPG and PDF. One command creates the app.

npx @layermetry/svelte-image-editor-starter my-image-editor
cd my-image-editor
npm install
npm run dev

Then open http://localhost:5173.

What you get

The app is a small "social post studio". You pick a format (Post 1:1, Story 9:16 or Banner 16:9), the editor opens with a ready-made design, and Export downloads the finished PNG. It uses Vite, Svelte 5 and TypeScript, and the code is short enough to read in a few minutes.

Licence key

The editor needs a Layermetry licence key. Get one at https://app.layermetry.com/signup. The key works on localhost straight away.

• The npx command asks for your key and saves it in .env.
• Or put it in .env yourself, after VITE_LAYERMETRY_LICENSE_KEY= (see .env.example).
• Or paste it into the app when it opens.

Manage your keys at https://app.layermetry.com/licenses.

Documentation

• Quickstart: https://layermetry.com/docs/image/quickstart
• Full documentation: https://layermetry.com/docs

Licence

The starter code is MIT licensed. The @layermetry/media-editor package has its own licence, included in that package.