Drawing Tools
The eight drawing tools, brush size, and color selection in detail.
This page covers the drawing tools and color controls in detail.
Tools
SpriteFrame has eight tools, grouped by the kind of input they use.
Point tools — draw at the touch point, sized by the brush:
- Pencil — draws pixels in the currently selected color, one brush stamp per touch point.
- Eraser — clears pixels back to transparent.
Area tools — act on a whole region and ignore brush size:
- Fill — flood-fills the connected region under your tap with the selected color, stopping at color boundaries.
- Replace — swaps every pixel of the tapped color for the selected color.
Shape tools — drag from a start point to an end point to draw an outline; the three variants share one slot (long-press it to switch):
- Line — a straight line between the two points.
- Rectangle — a rectangle outline.
- Circle — an ellipse outline.
Navigation:
- Move — pans the canvas without editing pixels.
Brush size
The brush size slider covers 1–50px; you can also type an exact value (up to 512px) into the numeric field next to it. The field accepts direct input for precise sizing beyond what the slider shows. Brush size applies to the point and shape tools; the area tools (fill and replace) act on whole regions and ignore it.
Colors and palettes
Palettes are grouped into five categories:
- Basic — general-purpose sets: Basic 15 Colors and Grayscale.
- Classic — retro hardware palettes such as Game Boy, NES, Commodore 64, Game Boy Color, SNES, and Sega Master System.
- Modern — contemporary pixel art palettes: PICO-8, DawnBringer 16, AAP-16, and Neon Cyber.
- Themed — mood-based palettes: Earth Tones, Pastel Dream, and Bubblegum 16.
- Custom — colors you’ve added yourself, plus a “Current Canvas” palette built from colors already used in the active canvas.
Tap a swatch to select it as the drawing color. Use Add Custom Color to save a new color to your custom palette.
Eyedropper
Tap the eyedropper icon next to the color section to enter pick mode, then tap any pixel on the canvas to copy its color into the current color selection.
Grid overlay
The settings panel includes a grid toggle and an opacity slider for it, useful for keeping track of pixel boundaries while zoomed in.
Layout
The settings panel’s Layout section adapts the editor to how you hold your device:
- Left-Handed Mode moves the top toolbar controls to the opposite side so they sit under your left hand instead of your right.
- Sidebar Position places the panel sidebar on the Left or Right edge of the screen.
Zoom and pan
Use the zoom slider or type an exact percentage (50–500%) into the numeric field in the tools panel. You can also pinch with two fingers to zoom directly on the canvas, and drag with two fingers to pan around it — both gestures work with any tool selected. The Move tool pans the same way with a single finger.