Design
The Design canvas: documents, prototypes, mockups, decks and motion, built from a description and refined visually.
What the Design app is
Design is the tab where visual work happens. You describe what you want, PandaOS builds it, and it opens on a canvas you can inspect, tweak, comment on and export. Nothing is written into your repository unless you ask for it: designs are saved with the project and versioned on their own.
Design is currently an experimental feature, so the tab appears once Experimental Features is on in Settings → Advanced.
The design types
Each type carries its own method, so "build me a pricing page" and "build me a deck" do not produce the same shape of output.
| Type | What it is | Exports |
|---|---|---|
| Document | Reports, one-pagers, briefs. Print-ready. | PDF, HTML |
| Prototype | An interactive, click-through UI with real states and navigation. | HTML |
| Mockup | A static high-fidelity screen or layout. | HTML, PDF |
| Slides | On-brand presentations, built on the structured deck engine. See Slides. | PPTX, Google Slides |
| Motion | Animated intros, product reels, kinetic type, on a scrubbable timeline. | HTML, MP4 |
| Freeform | Any HTML with no fixed methodology, the "just make something" path. | HTML, PDF |
| Product Demo | A screen recording polished into a demo, with auto-zoom on clicks and a smooth cursor. | MP4 |
Product Demo is announced but not yet available. It shows as coming soon and every creation path refuses it while the recording permission model is reworked. Existing demos still play.
Design systems
A design system pack is a saved palette, type scale, spacing, corner treatment and brand voice that new designs are built against, so output looks like your product instead of like a generic template.
You can import one from your codebase, where PandaOS extracts tokens from Tailwind config or CSS variables, or from text: paste a style guide, brand notes, or a token dump and PandaOS pulls the colours and fonts out of it. Packs are saved either to the project or to a personal library that follows you across projects. PandaOS asks which pack to use before it starts building rather than silently picking one.
Refining a design
Once something exists on the canvas there are four ways to change it, and all of them produce a new version rather than overwriting:
- Tweaks - direct controls for colour, type, spacing and layout, applied live.
- Comments - pin a note to an element and describe the change in words. Good for structural or subjective edits that no slider covers.
- Chat - ask for the change in the conversation; edits apply to the element, not by regenerating the whole file.
- Layers and inspector - select any element to see and adjust it directly.
A version menu keeps the full history, so you can step back to an earlier direction at any point. Motion designs add a timeline you can scrub, with tracks per element.
Sharing, exporting and handoff
- Share publishes the current version as a view-only public link. Anyone with the URL can open it, with no PandaOS account. It requires you to be signed in.
- Export takes the output with you, in the formats listed per type above.
- Handoff produces a developer bundle: the frozen HTML, the resolved design-system tokens, the brief the design was built from, and a stable id for every element. A coding session then builds the real multi-file implementation against that reference, instead of trying to turn a one-file design into an app in place.
Docker
Your local containers, images, volumes, networks and compose stacks inside PandaOS, with a shell, a file browser and a filesystem diff for every container, and the same surface exposed to Panda as tools.
Slides
Generate full presentation decks from descriptions or existing content, then refine and export them.