Open the editor
Go to /vector/. The editor loads, and you land on a blank canvas with a page sitting on it. Rendering runs on the GPU through Skia, so a document with a lot in it behaves much like a document with very little in it.
One thing is worth knowing before you draw anything: the document you are editing is SVG. Rayzia does not convert to SVG at the end. The rectangle you are about to draw is a
Draw a rectangle
- Pick the shape tool Press R, or click the shape slot in the tool rail down the left edge. Rectangle is what that slot holds until you change it.
- Drag on the canvas Press, pull out a box, release. You have a rectangle. It is a real object in the document, selected and ready.
- Look at the bar above the canvas It changed. Before you drew, it showed W, H, RX and RY for the next rectangle you would draw. Now it is bound to the rectangle you just made, so you can fix the size or round the corners after the fact rather than getting it right first time.
Tapping empty canvas hands the draw tool back to you, so you can keep drawing rectangles without picking the tool again.
Give it a colour
The dock on the right opens on the Fill and Stroke panel. With the rectangle selected, set its fill there and the canvas keeps up as you drag. Stroke lives on the same panel, targeted separately.
There is a faster route once your hands learn it. The rail carries a fill and stroke proxy, and these keys drive it.
| Keys | Does |
|---|---|
| X | Switch which paint you are editing, fill or stroke |
| Shift+X | Swap fill and stroke |
| D | Reset to the default: white fill, black stroke |
| , | Open the colour picker on the active paint |
| . | Give the active paint a gradient |
| / | Set the active paint to none |
Undo is cheap, so use it
Ctrl+Z steps back and Ctrl+Y steps forward. Nothing here is a one way door. That includes anything the AI assistant does to your canvas: it draws through the same commands you do, so it lands in the same history and it is one undo away.
| Keys | Does |
|---|---|
| Ctrl+Z | Undo |
| Ctrl+Y | Redo |
| Ctrl+A | Select everything |
| Ctrl+Shift+A | Deselect |
| Delete | Delete the selection |
When you want to see the trail rather than tap Ctrl+Z eleven times and hope, open the History panel from the dock. It lists every step by name, dims the steps you have undone, and jumps straight to any state you click.
Export it
- Open File ▸ Export Three formats: SVG, JPG and PNG. The Export icon on the command bar down the right edge opens the same three in a fly-out.
- Choose SVG The scene is serialised and downloaded. It is the document you have been editing all along, not a translation of it.
- Or choose PNG or JPG PNG keeps transparency. JPG gets a white background painted behind the artwork first, because JPEG has no transparency to keep.
Batch export lives in File ▸ Export for Screens, which crosses targets against scales and formats. On the free plan you get 1x and 0.5x in PNG, JPG, SVG and WebP. The 2x, 3x and 4x scales and PDF output are Pro.
That is the loop. Draw, colour, undo, export. Everything else in this course is detail hung on those four moves.
Common questions
Do I need an account?
Not to draw and not to export. An account gets you cloud files (three of them on the free plan), share links and version history on Pro. The editor itself works signed out.
Where does my work go if I close the tab?
To your own device. The document snapshots to IndexedDB about a second after your edits settle, with a flush when the tab hides. Reopen the editor and the session comes back, zoom and pan included. If you are signed in, the same snapshot also syncs to the cloud after a short quiet window.
Can I export a PDF?
Yes, through File ▸ Export for Screens, and it is Pro. Plain SVG, PNG and JPG export from File ▸ Export are free.
Does it work offline?
Yes. The editor runs in your browser and saves to your device. Cloud sync and the AI assistant need a connection, since one talks to our API and the other talks to yours.