# Pages

### Pages

Create new form pages and add components out of the toolbox with drag & drop 

<div align="left"><figure><img src="https://870194474-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-M_kE41Rl4pOtwKfvvQq%2Fuploads%2FryoQ3dtoD7zuBygJDfYV%2FImage%20create%20form%20page.png?alt=media&#x26;token=d50b2ec9-97fe-4ef1-9100-2ab12c3a124b" alt=""><figcaption></figcaption></figure></div>

Each page has the following **main designer tools**:

### **Left sidebar**

On form it is possible to drag and drop [**fields**](https://academy.any2info.com/any2info-academy/no-code-platform/app-studio/application-design/forms/fields-toolbox) out of a libary of components. The component will have a default **vertical postion on the canvas**.&#x20;

If you want to **group** controls use the components "Sections and columns" out of the toolbox item "Layouts". &#x20;

### Right side bar

By clicking the "**tabs or short cut icons**" you can set all sort of **properties and functions** for a page.&#x20;

<figure><img src="https://870194474-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-M_kE41Rl4pOtwKfvvQq%2Fuploads%2FcxcDsXAQRlxeBWNmVah7%2FToolbar%20form%20page.png?alt=media&#x26;token=a5059694-f383-4e3e-bc70-dad770a7cb38" alt=""><figcaption></figcaption></figure>

#### [Layouts](https://academy.any2info.com/any2info-academy/no-code-platform/app-studio/application-design/forms/layouts)

#### Properties

Set and modify the main properties of a form page

#### [Overview](https://academy.any2info.com/any2info-academy/no-code-platform/app-studio/application-design/forms/overview)

#### [Messaging](https://academy.any2info.com/any2info-academy/no-code-platform/app-studio/application-design/forms/events-actions-1)

#### [Events](https://academy.any2info.com/any2info-academy/no-code-platform/app-studio/application-design/forms/events-actions)

#### [Parameters](https://academy.any2info.com/any2info-academy/no-code-platform/app-studio/app-logic/forms/data-parameters)

#### Plugins

### **Toolbar above canvas**:&#x20;

<figure><img src="https://870194474-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-M_kE41Rl4pOtwKfvvQq%2Fuploads%2FVnIY98GeEt5zva4nhC8z%2FImage%20toolbar%20above%20canvas.png?alt=media&#x26;token=e029870e-63c2-4d48-98a4-1c674c233ae5" alt=""><figcaption></figcaption></figure>

* "Trash icon": Delete components from the canvas
* "Eye icon": Screen preview desktop, tablet and smartphone device
* "Question mark icon": Notes supporting the content of a page
* "Arrows icon": Collapse group fields
* "Document icon": Download Word merge document
* "Cogs icon": Open page properties in the right sidebar

###