How to add elements to the canvas

How to add elements to the canvas

Add elements to the canvas to create and customize your designs. You can add basic elements from the bottom toolbar or choose ready-made elements from the Wireframe Library and Diagram Library.

Before you start

Make sure you have permission to edit the board and are in design editing mode.

Where to access elements

You can access elements from the bottom toolbar of the board. The toolbar provides quick access to common design and diagram elements. Select an element type to view the available options.

Available element types

  1. Wireframe elements: Use wireframe elements to design app and website interfaces. These include basic elements such as sections, containers, images, and text, as well as smart components such as buttons, form controls, tables, menus, charts, and other ready-to-use UI elements.

  2. Diagram elements: Use diagram elements to create flowcharts, use case diagrams, entity relationship diagrams, class diagrams, and other visual workflows.

  3. Text: Add headings, labels, descriptions, and other text content to your designs.

  4. Icon: Add icons to represent actions, objects, navigation items, or other visual information.

  5. Sticky note: Add sticky notes to record ideas, feedback, reminders, or supporting information on the board.

Info
To open the full library, use one of the following options:
  1. Open More from the bottom toolbar, then select Wireframe Library or Diagram Library.

  2. Open Wireframe elements or Diagram elements from the bottom toolbar, then click View all.

Add an element to the canvas

  1. Open the board where you want to add an element.
  2. Select an element type from the bottom toolbar, Wireframe Library, or Diagram Library.
  3. Choose the element you want to add.
  4. Click the canvas to place the element.
  5. Move, resize, or customize the element as needed.

Note

  1. The available settings depend on the element you select.
  2. You can place elements inside screens, sections, and containers.
  3. See the related element guides for detailed instructions and customization options.
Need more help?
If this does not solve your issue, contact support and include a screenshot if possible.

    • Related Articles

    • How to add a blank screen to the canvas

      Add a screen to the canvas when you want to create a new page, flow step, or design variation in your board. Before you start Make sure you have permission to edit the board. How to add a blank screen Open the board where you want to add a screen. ...

    • How to use Image elements

      Use Image elements to add uploaded images, stock photos, AI-generated visuals, or placeholders to your designs. Before you start Make sure you have permission to edit the board. The availability of workspace images and some AI features may depend on ...

    • How to add custom fonts in Visily

      Add custom fonts to use your own brand or client-specific typography in Visily designs. Custom fonts can be uploaded at the workspace level for reuse across boards, or at the board level for use in one specific board. Before you start Custom fonts ...

    • How to use Text and Link elements

      Use Text and Link elements to add headings, descriptions, labels, and clickable text to your designs. Before you start Make sure you have permission to edit the board and are in design editing mode. Text element types Visily provides the following ...

    • Wireframe Elements in Visily

      Visily provides a wide range of ready-to-use elements for building app and website wireframes. These elements help you create consistent interfaces quickly without designing every component from scratch. Before you start Make sure you have permission ...