# What is a mode?

Every app you use has its own look. When you switch on dark mode, or a brand rolls out its seasonal colors, that choice lives *inside that one app*. Leave the app and the look stays behind. Your preferences don't come with you; a brand has to rebuild its look separately in every place it appears.

This standard — built on the **Mise en Mode** approach — starts from a different idea: **a look should be something you own, not something an app owns about you.** You describe a look once, save it to your own account, and any app that speaks the standard can render your content that way — the same look, everywhere you go.

## Describing a look by what things are *for*

The trick that makes a look portable is *how* you describe it.

You could describe a look as a pile of raw values — "this blue, that grey, 16 pixels here." But raw values don't travel. One app's "blue button" is another app's "link," and a color that reads as *primary* in one layout is barely visible in another. Hand an app a bag of colors and it has no idea what to do with them.

So instead of naming values, Mise en Mode — the approach the standard is built on — names **jobs**. You don't set "blue" — you describe *"the color of a primary action."* You don't set "16px" — you describe *"the size of body text."* Each of these jobs is called an **intent**: a slot defined by what it's *for*, waiting to be filled with a value.

Because every app agrees on the same set of jobs, your one description fits all of them. An app already knows what "a primary action" is — it has buttons. It just asks your look, *"what should a primary action look like?"* and paints accordingly.

### The jobs a look is made of

The current standard describes a look with a small, fixed vocabulary of jobs, in two families:

- **Color** — three kinds of thing that need color:
  - **Surface** — the backdrops and containers your content sits on.
  - **Action** — the things people click: buttons, links.
  - **Control** — form fields: inputs, checkboxes, selects.
- **Typography** — how **text** looks: its size, weight, font, and spacing.

Actions, surfaces, and text each come in three levels of emphasis — **primary**, **secondary**, and **auxiliary** — so a look can distinguish the main button from a quieter one. Add it all up and today's standard is **33 intents**: enough to describe a coherent look, small enough to hold in your head.

:::note[The vocabulary grows — carefully]
Thirty-three isn't a permanent ceiling. New jobs (motion, density, data-visualization colors) can be added over time. The rule is that additions never break older looks — a look you save today keeps working forever, even as the vocabulary expands around it.
:::

## Four words worth knowing

The rest of the standard uses four plain terms. You already understand the ideas; these just name them.

| Term | What it means |
|---|---|
| **Intent** | A job in a look — *"the background of a primary surface."* The slots you fill. |
| **Theme** | A complete look: every intent, filled in with values. The thing you save. |
| **Expression** | The *reason* a theme exists — the concept it serves. "Easter." "Critical." "My midnight look." |
| **Mode** | A theme actually applied to something on screen — a look, switched on for a region of a page. |

A quick way to hold them together: an **intent** is a slot, a **theme** fills all the slots, its **expression** says *why*, and a **mode** is that theme *in use* — the moment a look is switched on for part of a page.

## Why an expression, and not just a name?

A theme isn't created for no reason. It exists to express *something* — a mood, an occasion, a brand moment. That "something" is its **expression**, and it's the hinge that lets different people's looks line up.

Say Home Depot applies a look for *Easter* to a seasonal section of its site. You, meanwhile, have saved your own *Easter* look. Because both looks name the same expression — "Easter" — an app can honor **your** Easter over the brand's when you're the one viewing. The expression is the common thread that says *"these two looks are about the same thing,"* so yours can stand in for theirs.

That's the whole point of describing looks by intent and tagging them by expression: not just that your look is portable, but that it can **meet other people's looks** and take precedence where it should.

## Where a look lives

A theme is saved to **your account** — the same kind of account that carries your posts and identity on the AT Protocol network (the network Bluesky is built on). You don't hand your look to an app to keep; you keep it, and apps read it when you show up. Delete it, change it, or point at someone else's — it's yours to control.

That's the difference in one line: **not a setting inside an app, but a look you own that any app can honor.**

## Where to next

- **[The Mode Contract](https://standard.mode.place/contract/)** — the precise rules for how a look is resolved and rendered when several are in play at once.
- **[Publish a theme](https://standard.mode.place/guides/publish-a-theme/)** — save a look to your account.
- **[Render themes in your app](https://standard.mode.place/guides/render-themes/)** — honor people's looks in what you build.
- **[Schema reference](https://standard.mode.place/reference/schema/)** — every intent and field, in full.