# Customize

URL: /products/app/customize · Id: `page:products/app/customize`

> How to change what an App shows, from one slot to a whole screen to custom code, while everything you leave alone keeps compiling.

Make the smallest edit you can, and everything you leave alone keeps compiling. An [App](/business/nouns/app) takes four kinds of [Change](/business/nouns/change), smallest first: the definition, a slot, a view override, and code.

## The definition
Most changes are a line in the declaration. Add a [Verb](/business/nouns/verb) to a [Persona](/business/nouns/persona)'s `may` list, and its button appears. Add a property to `Lease`, and every list, record, form, route and export carries it on the next merge.

## Slots
Every compiled screen names its slots: `list.toolbar`, `list.empty`, `record.header`, `record.aside`, `record.actions`, `record.tab`, `form.after` and `dashboard.section`. A slot takes any [Component](/business/nouns/component) whose props bind to the record in view.

Leaseline puts a [`Timeline`](/code/ui/components/timeline) in `record.aside`, so each lease shows its notices and answers beside the record:

```mdx title="apps/portal/app.mdx"
---
kind: saas
nouns: [Lease]
slots:
  record.aside: Timeline
---
```

A slot never widens what the reader may do. A Component in `record.actions` calls Verbs through the same [Permissions](/business/nouns/permission) as the compiled form.

## View overrides
A `view.mdx` file replaces one compiled screen with Components, and every other screen keeps compiling. [Views](/code/file-conventions/views) has the file's keys. Override the screen your [Customers](/business/nouns/customer) spend their day on, and leave the rest.

## Theme
The App wears the [Startup](/business/nouns/startup)'s [Brand](/business/nouns/brand). Its [Theme](/business/nouns/theme) sets color, type, spacing, radius and motion for every Component, light and dark. A Customer never sees the platform's name or styling.

## Code
When no Verb fits, the `code/` folder holds a program, and a route sends one path to it. [Code](/code/file-conventions/code) covers the folder. Code is the last resort: it does not compile from the definition, so it is yours to keep in step.

## Embed in a customer's product
Status `planned`. A Customer places one App screen inside its own product, signed in as its own user, under the Customer's Theme. The screen keeps every rule and Permission of the App it comes from.

## Next
[Mobile and offline](/products/app/mobile-and-offline) covers the App on phones.