JPixel
A simple HTML5 editor for pixel-art animations.
Credits
Author: Emanuele "Emad" Franceschini
Website: http://emad.itch.io/jpixel
Twitter: @emad_jigoku
Shortcuts and commands
Tools
- C - Move
- S - Select
- W - Wand
- P - Pencil
- E - Eraser
- B - Bucket
- H - Hand
- T - Tile
While using the pencil tool:
- Center click - Quick eyedropper
- Right click - Quick eraser
While using the pencil and bucket tools:
While using the select tool:
While using the tile tool:
- Left click - Draw Tile
- Center click - Copy Tile (you can drag to select multiple tiles)
- Right click - Clear Tile
- Note: You set the tile size under Image > Canvas Size
While using most tools:
File
- Ctrl+Shift+F - New file
- Ctrl+O - Open file
- Ctrl+W - Close file
- Ctrl+S - Save file
- Ctrl+Shift+S - Save file as
Edit
- Ctrl + Z - Undo
- Ctrl + Shift + Z - Redo
- Ctrl + C - Copy selection
- Ctrl + X - Cut selection-
- Ctrl + V - Paste selection
- Ctrl + A - Select all
- Ctrl + D - Deselect
- Ctrl + R - Rotate 90° Clockwise
- Ctrl + Arrows - Move layer/selection
- Ctrl + Shift + Arrows - Move layer/selection fast
Image
- Ctrl + Alt + C - Configure canvas (size, background, tiles)
- Left arrow - Previous frame
- Right arrow - Next frame
- Up arrow - Previous layer
- Down arrow - Next layer
Editor
- Ctrl + P - Hide/Show animation preview
- Ctrl + G - Hide/Show grid
- Ctrl + H - Hide/Show tile grid
- Ctrl + T - Hide/Show tileset panel
- Ctrl + O - Hide/Show previous frame
Frame/Layers
- Left click preview - Select
- Left click preview + Drag - Change order
- Ctrl + Left click preview - Select non-transparent pixels
- 1, 2, 3, ..., 9 - Focus N-th frame
Palette
- Left click - Get color
- Ctrl + Left click - Set color
- Shift + Left click - Remove color
Tileset
- Left click - Get tile
- Ctrl + Left click - Set tile
- Shift + Left click - Remove tile
Resources