image-editor
A basic image editor that runs entirely in the browser. No build step, no
dependencies, nothing leaves your machine.
Features
- Brush, eraser, line, arrow, rectangle, ellipse, text, fill, and color picker tools
- Primary and secondary colors that swap with one key
- Layers: add, delete, reorder, hide, and merge down
- Text stays editable on its own layer: drag to move it, click to edit it
- SVGs open as vector layers, so resizing or rotating the image keeps them sharp
- Image menu: image size, canvas size, rotate, flip, trim edges, and flatten
- Open an image from disk, from a URL, by drag-and-drop, or by pasting from the clipboard
- Save as PNG or copy to the clipboard
- Undo / redo, zoom, mouse / touch / pen input
Shortcuts
| Key | Action |
|---|
B E L A R O T G I | Brush, eraser, line, arrow, rectangle, ellipse, text, fill, pick color |
X | Swap primary and secondary colors |
[ / ] | Decrease / increase stroke size |
Shift (while dragging) | Snap lines and arrows to 45°, constrain to square / circle |
Ctrl+Enter / Esc | Apply / cancel text |
Ctrl+Z / Ctrl+Shift+Z | Undo / redo |
Ctrl+O / Ctrl+S | Open / save |
Ctrl+Scroll / pinch | Zoom the canvas around the cursor |
Shift+Scroll | Scroll the canvas horizontally |
Development
Open index.html in a browser, or serve the directory:
python -m http.server
