> ## Documentation Index
> Fetch the complete documentation index at: https://docs.subframe.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Page layouts

> Apply reusable navigation and modal layouts to your pages.

Page layouts are reusable templates that wrap your page content with headers, sidebars, modals, or drawers.

<Frame>
  <img src="https://mintcdn.com/subframe-59800133/E2DcgNWNaQUj3Q4q/images/design-mode/page-layouts.png?fit=max&auto=format&n=E2DcgNWNaQUj3Q4q&q=85&s=e7a04a94f8dd6192de674532e9cb1c49" alt="Page layouts showing the page settings dropdown" width="376" height="664" data-path="images/design-mode/page-layouts.png" />
</Frame>

All layouts have a slot property called `children` that cannot be deleted. Any page contents will be rendered inside this slot.

## Applying a layout

1. Open a page in the editor.
2. Ensure you don't have any elements selected. You should see layouts in the right sidebar.
3. Click on the layout to apply it to the page.

## Creating a new layout

<Frame>
  <img src="https://mintcdn.com/subframe-59800133/E2DcgNWNaQUj3Q4q/images/design-mode/new-layout-dialog.png?fit=max&auto=format&n=E2DcgNWNaQUj3Q4q&q=85&s=5ed2d1a7ed2d36ecd2fdd6cdd48679c1" alt="New layout dialog" width="792" height="616" data-path="images/design-mode/new-layout-dialog.png" />
</Frame>

1. Open a page in the editor.
2. Ensure you don't have any elements selected. You should see layouts in the right sidebar.
3. Click on the **+** new layout button.
4. Select a layout template or start from blank to create your layout.
