---
title: "Add and arrange modules"
description: "The rail, the module cards, looks, the toolbar and layers."
slug: "en/customs/design/add-and-arrange-modules"
url: "https://docs.custom.one/en/customs/design/add-and-arrange-modules/"
capability: "result-page-modules"
published_at: "2026-09-11T09:38:37.729Z"
---
The rail down the left of the canvas is where everything comes from. Click an
icon and its card opens right beside it; click the icon again, press Esc or
click elsewhere to close it.

## The rail

- **Templates** at the top drops in a ready-made page — as a new page, or in
  place of the current one.
- **Modules** holds **Search** and one icon per family: **Basics**, **Images**,
  **Smart**, **Charts**, **Embed** and **Elements**. Workspaces in the beta
  programme also see **AI**, which opens Custom AI to [design the page for
  you](/en/customs/design/designing-a-page-with-ai/).
- **Page** holds **Theme** (colours, fonts and the look of every module),
  **Layout** (the video format) and **Layers**.

Each family's card lists its modules as tiles, grouped into sections — see
[Modules](/en/customs/design/modules/) for what's in each. Hover a tile to see
what it does.

**Search** finds any module by its name or by what it shows, across every
family. Shapes, lines and icons aren't in search; they're in **Elements**.

## Put it on the page

Click a tile to add the block in its default look, or drag the tile to where you
want it. Once it's there, drag to move it and pull a corner to resize. Blocks
can overlap and sit anywhere, and the arrow keys nudge them.

New blocks have no background. To give one the theme's card behind it, select
it and choose **Fill** → **Theme card**; **None** takes it away again.

## Change its look

Most blocks come in several looks. Select one and the toolbar above the page
shows a **Look** menu with the current look's name: open it to see every look
as a thumbnail, with a tick on the current one. Changing the look keeps the
block's content, size and position. HTML blocks and elements don't have looks.

## The toolbar

The toolbar appears above the page whenever something is selected. It holds the
look, font, text size and style, text colour, alignment, **Fill**, **Colors**,
transparency, **Arrange** for what paints in front, lock, duplicate and delete.

Select two or more blocks with shift-click, or drag a box across the canvas, to
get alignment controls for the group — and, from three blocks, even spacing.

Right-click a block for **Duplicate**, **Copy**, **Paste**, the stacking order
(bring forward, send backward, to the front or back), **Lock** and **Delete**.

## Layers

**Layers** lists every block on the page, front-most first. Drag a row to change
what sits in front, click one to select it, and use the padlock to lock it in
place.

## Shortcuts

Press **?** on the canvas for the full sheet. The ones worth knowing: hold **⌥**
while dragging to drag a copy, **⇧** while pulling a corner to keep the
proportions, **⇧** with the arrow keys to nudge 10 px, and **⌘** while dragging
to move without snapping.