Toolbar Panel Elements

The toolbar is the panel found at the topside of the BuilderX window. This toolbar can be easily spotted because it holds the name of the project in the middle.

Top Toolbar

It contains the following buttons:

  • A drop down Menu icon.
  • A Select Default Tool button that changes your cursor to the original pointer.
  • An Insert Rectangle button that lets you draw a rectangle in your project.
  • An Insert Ellipse button that lets you draw an ellipse in your project.
  • An Insert Image button that lets you upload and insert images from your hard disk to your project.
  • An Insert Text button that lets your draw a text box in your project and adds dummy text to it which is editable.
  • An Insert Icons button that lets you choose and insert icons from a wide range of icon packs, straight into your artboard.
  • Finally, an Insert Path button that lets you make free shapes by joining drawing a path in the shape of your unique structure.

On the right side of the panel, the percentage indicator shows the amount of zoom applied on the canvas and can be adjusted by zooming in or out, as well as clicking on it and selecting a value.

Left Toolbar

Project Name

This area displays the name of the project. The warning sign tells the user to download BuilderX Desktop Manager app if fonts are missing in the project.

Stage Toolbar

Pixel Zoom

BuilderX has a pixel-zoom feature that allows you to zoom your Stage area without any limitations. No design in the Artboard gets pixelated and enable you to see the intricacies of the design and make it pixel perfect.

Zoom Dropdown

The Zoom dropdown lets you see more or less of your Canvas depending on the zoom level, which is indicated by a percentage under the icon.

Right Toolbar

Share

The Share button lets you share your project with your team members and/or set your project to public or private. You can invite people to collaborate with you on your project or generate a link and share it with people.

You can toggle between the Code and Design button to view the generated code and design options respectively.

Design

The design button opens the Design Panel which is explained in Design Panel Elements.

User

This option takes you back to the dashboard, or logs you out, based on your decision.