Spaces

Move through a tiling workspace built around each stage of app work.

The Contrast workspace is a tiling window manager. Every pane lives in one horizontal row of columns you resize, stack as tabs, and rearrange, and the sections are named regions of that row. Whatever arrangement you build persists, so it comes back exactly as you left it.

The sections

The left bar is the section switcher. Stage is home: the row in free order, front first, which is where summoning a pane from the command menu or from chat brings it. Pressing any other button groups the row by section and scrolls to that section’s region. Four sections each own a stage of the work:

  • Dev runs the editor with live web and native previews. Write code here and watch it run.
  • Plan pairs project docs with the kanban board the factory works from.
  • Factory is the agent fleet view: the agents, their chats, and the factory floor.
  • Production holds the deploy controls and build history alongside inspection panes pointed at your real deployed app.

A fifth, Design, lays every screen in your app out on one canvas to inspect. It is opt-in for now: add ?design to the URL of a project that targets native to put it in the switcher.

The active section stays in sync with the URL, so a section is a shareable link and the back button works the way you expect.

Columns, panes, and stacks

Columns are laid out left to right on a scrollable track. Nothing overlaps and nothing hides behind another window: columns scroll into view as you focus them. Each column holds a vertical stack of panes, one visible at a time until you expand the stack. Dragging reorders columns freely on the Stage, and within a section’s own region once the row is grouped.

The chat with Lux lives in a persistent sidebar on the left edge, not inside any section. Press ⌘\ to show or hide it. Secondary surfaces like DevTools dock in the top bar as named stacks. Press ⌘⇧\ to float the top-bar panes over the bottom of the viewport, and drag a pane in or out to re-home it.

Focus is deliberate. Scrolling over the canvas moves the row sideways rather than the page, so the workspace never scrolls out from under you. Click a pane to focus it and the keyboard belongs to that pane until you press Escape to release it.

Keyboard

Every shortcut is reachable in-app: press ⌘/ anywhere to open the live hotkey overlay, which is generated from the same registry that drives the keys, so it never drifts.

  • Focus the column to either side with and . Use ⌘← and ⌘→ to reach the first or last column in the row, or jump to a pane by number with ⌘1 through ⌘9.
  • Cycle through the panes stacked in the focused column with ⌘[ and ⌘].
  • Use ⌘Z and ⌘⇧Z to move backward and forward through the panes and stage arrangements you visited. Text fields keep their normal undo and redo.
  • Fullscreen the focused pane with ⌘↩, and toggle a column between tabs and an expanded stack with ⌘⇧↩. Escape steps back out.

Arranging panes

Arrange panes to fit the task: drag a column edge to resize, drag a column header to reorder it, or drag a pane out into its own column. Switch a column between stacked and tabbed, or send a pane up to a top-bar stack. Any pane can go fullscreen, and hiding the top bar gives the canvas the whole viewport. Reset a section to its default layout at any time from its pane menu.

Ready?

Create a web, iOS, and Android app in minutes with agents working alongside you.