# Composing Layouts
## Building a base layout {#layouts}
Cotton makes building layouts a piece of cake. Let's start with composing a base layout that contains the base of our view:
```html label=cotton/layouts/base.html
...
{{ slot }}
```
## Create layout variants {#variants}
Imagine that we're creating a web app with an authenticated area, so we'll need areas for guests and users. Let's create these, extending from the base component.
```html label=cotton/layouts/guest.html
{{ slot }}
```
```html label=cotton/layouts/app.html
{{ sidebar }}
{{ slot }}
```
## Using the layouts {#usage}
```html label=login.html