Draw on dots.
dotty is grid-based vector drawing for logos, icons and type: place points on the grid, join them with lines, arcs and curves, on three layers, on a grid without edges, and take the SVG out. Dotgrid, rebuilt as a web app with its drawings kept on the server.
Click the grid.
Every click places a point on the 15 px grid. Drag a point to move it; with Shift its whole segment goes, with Alt the whole layer, with Ctrl a copy. Drag a box to select points; drag the selection to move it, with Ctrl to copy. A right click removes it.
Keys add a point, remove one, move the cursor
| Grid | 15 px, toggled with H |
| Undo | Ctrl+Z, 256 steps |
Join them.
A line, an arc either way, a full arc either way, a quadratic Bézier through three points, or a close back to the start. A stroke that starts where the last one ended continues it.
Keys line, arc, arc rev, bezier, arc full, arc rev full, close
| Linecap | butt, square, round (Q) |
| Linejoin | miter, round, bevel (W) |
Three of them.
Foreground, middleground and background, each with its own thickness, caps, colour and fill. Merge them when the drawing is done.
Keys R fill, G colour, { } thickness
| Colour | auto, a riso ink, or your own |
| Merge | Ctrl+M |
SVG, small.
The drawing, or the selection, exports as an SVG cut edge to edge to its shapes: strokes as they are, expanded into filled outlines, or merged into one path a colour, written small. Every edit is kept on the server; a .grid file downloads it, opens again, and pastes a layer into another drawing. Dotgrid's .grid files open as they are.
Kept on the server, saved after every edit
| Download | .grid (JSON) |
| Export | SVG: strokes, expanded, merged |