Designer
A full vector design studio — professional illustration and UI design in one place.
Designer is Circuitry's standalone design surface: a complete vector editor for illustration and a screen-and-artboard tool for UI design. Draw freehand or with precise vector tools, organize work across multiple artboards with layers, then turn any drawing into production HTML — all on desktop or iPad with Apple Pencil.
Two tools in one
Vector illustration — precise vector drawing, shape tools, path and vertex editing, curve optimization, and clean SVG export.
Screen & UI design — multiple artboards, a full layer system, reusable design systems, alignment guides, device-size previews, and screen-to-screen prototyping links.
You don't pick one or the other. Illustrate an icon, drop it onto a screen, lay out a page around it, and preview the whole thing on a phone — without leaving Designer.
Four modes
Switch modes from the header tabs. Your choice is remembered per design.
| Mode | What you do |
|---|---|
| Design | Draw freehand or with vector tools on any artboard |
| Layout | Drop responsive grids, flex rows, sections, and containers |
| HTML | Turn drawings into real HTML, SVG, or code |
| Preview | See the true render at 100% on mobile, tablet, or desktop |
Drawing & vector tools
Everything you'd expect from a professional vector editor:
- Pen, marker, highlighter, and smoothing brushes for freehand and precise lines
- Shapes — rectangle, ellipse, polygon — with shape recognition that snaps rough sketches to perfect geometry
- Vertex editing and automatic curve optimization for clean paths
- Text, text-on-path, icons, and stamps
- Fill, eraser, and full selection / transform with perspective warp
- Pressure-sensitive Apple Pencil input with high-resolution capture
Artboards & layers
- Multiple artboards in one document, each with its own size, background, and layers
- Full layer panel — add, delete, reorder, set opacity, show/hide, and set a per-artboard background color
- Ruler-based alignment guides with snapping for pixel-perfect placement
- Screen-to-screen links to wire up clickable prototypes
Design systems
Designer learns the fonts, colors, and patterns you use across all your artboards. When you ask AI to generate a layout or component, the result automatically matches your existing design language — change your palette once and regenerate everything.
From drawing to production
Any drawing converts to clean HTML, SVG, or code — non-destructively. Switch back to Edit Strokes at any time to return to the original vectors. Layout components become real responsive CSS; drawn shapes become real markup. Export finished work as SVG, PDF, or PNG with layers intact.
On iPad
Full Apple Pencil support, gesture controls, and complete feature parity with desktop. Sketch a wireframe by hand, recognize it into shapes, lay it out, and preview it on-device — the most capable vector and UI design tool available on tablet.
Related
- Web Design Studio — generating and composing web pages inside workflows
- Design References & Systems — build once, reference everywhere
- Vector Graphics & Drawing — the drawing tools in depth
- Apple Pencil High-Resolution Capture
- Image to Vector (ToVec) — trace a raster image into editable vectors
- Visual Engineering — design architecture and diagrams visually