User Guide
OpenPencil is an open-source, Figma-compatible design editor — fully local, AI-native, and programmable. This guide covers everything you need to know to use the editor effectively.
Cross-platform shortcuts
Throughout this guide, keyboard shortcuts use Mac notation: ⌘ = Command (Ctrl on Windows/Linux), ⌥ = Option (Alt), ⇧ = Shift.
Getting Around
- Canvas Navigation — panning, zooming, and the hand tool
- Selection & Manipulation — selecting, moving, resizing, rotating, and organizing nodes
Creating Content
- Drawing Shapes — rectangles, ellipses, lines, frames, sections, polygons, and stars
- Text Editing — creating and editing text with rich formatting
- Pen Tool — drawing vector paths with bezier curves
- Icons — searching icon sets, inserting icons, and swapping or recoloring them
Organizing & Managing
- Layers & Pages — the layers panel, pages, and properties panel
- Context Menu — right-click actions for clipboard, grouping, components, and more
- Exporting — image export and .fig file operations
- Cloud Storage — documents and libraries in your own S3-compatible bucket
Advanced Features
- Auto Layout — flexbox-based automatic positioning
- Components — reusable components, instances, and overrides
- Variables — design variables, collections, modes, and fill bindings
- Checking Designs — the Check panel, canvas issue markers, and lint rules