Learn MODO
These instructions are reviewed against the app source. Final-installer walkthroughs are still pending. Check platform availability and requirements before installing. Windows is an updates list, outside the 1,000 beta places.
One small project. A clear way into the canvas.
02 / BEFORE YOU BEGINInstall & sign in ↗What is ready, what is not, and how offline works.
Design locally, understand what you are changing, and keep an editable copy before delivering an output. These guides use the English interface.
In the desktop app, choose Help → Learn MODO or press F1. You can also open Learn MODO from Welcome or use a panel's Help ↗ button. The guides open in a separate window and work offline. Search with Cmd/Ctrl+K, follow the on-page links, or use the back and forward buttons to revisit a guide.
This edition covers the app reviewed on 20 October 2026, during the private alpha preparation. The guides are source-reviewed drafts; they are not a claim that the latest installer, every platform or every external account has been verified.
Start here
- What is MODO?: local design, output formats and what needs an online service.
- Install MODO and sign in: intended alpha installation and activation, offline use and current availability.
- Set up your workspace: appearance, language, playgrounds and precise navigation.
- Find your way around: canvas, panels and active frame.
Your first website
- Find your way around: identify the canvas, panels and active frame.
- Create your first website: turn the starter page into a simple studio introduction.
- Control spacing and sizing: use padding, gap, Hug and Fill deliberately.
- Work with breakpoints: adapt the page for narrower widths.
- Save, reopen, and recover a project: understand the working folder and portable copies.
- Export a website to a folder or ZIP: create local files for your next workflow.
Build on the basics
- Add text, images, and local fonts
- Create and reuse a component
- Use tokens for reusable colors
- Draw, trace and export vectors
- Use animated images, video and Lottie
- Add interactions and transitions
- Animate with Motion
- Manage content with the local CMS
Deliver and connect
- Publish a website and connect a domain
- Export a project, tokens or a component to GitHub
- Exchange designs with Figma
- Prepare native apps and store materials
- Connect an agent through MCP
Share and get help
Local editing does not require an AI connection or a hosting account. Keep a .modo copy when you reach a useful milestone; the exported website serves a different purpose from your editable MODO project.
Need a correction? Tell us