Create a new project at any time using the New project + dropdown in the top-right corner of the dashboard. Choose to start from scratch or jumpstart the project with a page from your library or generate a page draft with AI.
The project will be created in whichever space (Drafts, Team Folder, etc.) you're currently viewing. If you create a project from the Home view, it will be automatically placed in Drafts.
Starting a New Project
When creating a new project, you’ll be given the following starting options:
From scratch: Desktop or Mobile
Start with: Library page, Figma design, and Page draft (AI)
From Scratch
Start with a clean slate — no pre-built content, just you and your creativity. When starting from scratch, you’ll choose a main breakpoint — the device where you’ll do most of your design work:
Desktop-first
Mobile-first
The main breakpoint determines where styling begins. For example, if you start with desktop-first, your styles (size, color, layout, etc.) will cascade down to tablet and mobile. Learn more about breakpoints.
When selecting Desktop or Mobile, you'll be set up with our default breakpoints:
Desktop: 1024px and up
Tablet: 600px – 1023px
Mobile: 599px – 320px (320px is the minimum canvas size)
Saved Breakpoint Presets
If you often work with custom breakpoints, you can save them as a preset:
Navigate to and hover Presets in the New project dropdown
Find and selet Manage presets at the bottom of the presets list
In the modal, find and select Create new preset
Give your preset a name
Add or adjust breakpoints. Choose a new main breakpoint by opening the breakpoint editing panel, and toggle Set as main breakpoint.
Once saved, you'll find this as a preset to start a new project from.
Upgrade to the Professional or Organizational plan to save and reuse breakpoint presets across multiple projects.
Jumpstart your Project
The New project dropdown allows you to select a starting point to move into the project starting off with a Library page, Figma design, or Page draft (AI).
Library page: Start with a pre-approved page from your team library. Learn more about Libraries.
Figma design: Import a design directly from your Figma account. Learn how to import from Figma.
Page draft (AI): Generate a page structure using prompts with text and images as context. Read more about AI page draft.
Naming Your Project
To name or rename your project:
Click on the Project Title field at the top of the editor. If not set, it will say Untitled.
You can also change the folder where the project is stored from this same menu.
Project Settings
You can enter the Project settings by clicking the cogwheel in the bottom left corner. The settings panel appears on the left side of the editor. Here's what you can adjust:
Color Styles: If defined on folder level, the colours will be inherited into the project settings. These colours can be overridden on the project level. Set a color theme for your folder when using templates.
Breakpoints: Learn how to manage breakpoints here.
Project Tags
Figma Import: See how to import a project from Figma.