Skip to content

Designs

A design is a named look the builder is told to follow. Picking one is how you stop every generated app from coming out the same.

AI builders have a house style. Left to itself, a model produces the same rounded buttons, the same spacing, the same gradient, over and over — recognisable at a glance and not what you asked for.

Designs are the fix. A design is a set of written instructions about how an app should look: palette, typography, layout, component treatment and motion. When you choose one, those instructions are put in front of the builder before it writes anything, with an explicit order to follow them over its own defaults.

Choosing one

On the dashboard, under the prompt composer:

🎨 Look: [ Surprise me ] [ Swiss Minimal ] [ Midnight Glass ] …

Surprise me is the default, and means no design — the builder uses its own taste. Each other pill shows a small two-colour swatch and the design's name; hovering shows its one-line description. Clicking selects; clicking the selected pill deselects.

At most six designs are offered here. If your installation has none configured, the row does not appear at all.

Changing the design later

You can, and it affects the next build, not the app you already have. The builder is not asked to repaint an existing app when you change the design; it is simply given different instructions the next time it writes something.

To actually restyle an existing app, change the design and then ask for it in the chat: "Restyle the whole app to match the new design."

The designs that ship with Bookbag

A fresh installation is seeded with eight designs in five categories. An administrator can edit them, add more or remove them, so your installation may differ — but these are the defaults.

Design Category What it is
Swiss Minimal Minimal Black on white, strict grid, one accent. System sans throughout, hairline borders, no gradients, no shadows. Motion limited to a 150ms colour change on hover.
Soft Brutalist Bold Thick borders, flat blocks, unapologetic colour.
Midnight Glass Bold Dark and luminous, frosted surfaces, gradients.
Broadsheet Editorial Serif headlines, rules, reading first. A magazine, not an app.
Candy Pop Playful Rounded, bright, cheerful.
Quiet Corporate Professional Navy and slate. Calm and credible.
Terminal Mono Minimal Monospace, dark, developer-native.
Warm Boutique Editorial Earthy, photographic, unhurried.

The five categories are Minimal (restrained, typographic, lots of air), Bold (high contrast, big type, saturated colour), Editorial (magazine feel — serif headlines, measured columns), Playful (rounded, colourful, a little motion) and Professional (calm, trustworthy, enterprise-ready).

What a design actually says

Each one is five labelled lines: Palette, Typography, Layout, Components, Motion. Swiss Minimal's, abbreviated:

Palette: white background, near-black text, one accent used sparingly. Borders #e5e5e5. No gradients, no shadows beyond a hairline border. Typography: system sans throughout. Hero 48–64px, tight tracking, weight 600. Layout: strict 12-column feel, max width 1100px, sections separated by 96px. Components: buttons are rectangles with a 4px radius. Cards are bordered, never shadowed. Motion: none beyond a 150ms colour transition on hover.

That specificity is the point. Vague guidance — "make it modern" — produces the generic look the designs exist to avoid.

You cannot read the full instructions from inside the product; they are given to the builder but not shown in the picker. Only administrators see them, on the Designs admin page.

Designs and the builder's own rules

A design does not replace the builder's rules, it is layered on top. Every build is also given a set of platform skills — playbooks about project layout, general design quality, responsive behaviour, state handling and checking the build compiles. See Skills.

The design comes first in the prompt and is marked as the user's choice, so where the two disagree about a visual decision, the design wins.

If a design is removed

Designs can be deactivated or deleted by an administrator. A project still pointing at one that is gone simply builds without a design direction — the builder falls back to its own taste. No error, no warning. Apps already built are untouched.

Who can change a project's design

Anyone who can change the project: its creator, and owners, admins and members of its organization. Viewers cannot.

Next