Window
How to add and style window mockups.
Last updated
Was this helpful?
How to add and style window mockups.
Last updated
Was this helpful?
A Window part shows a box that looks like an operating system window.
Within the window is a container that will house the content you want to display in the window.
Location in the Parts Library: Base Parts > Mockups > Window
Select the container within the window.
The container is a versatile part. You can add most other parts here to create what you want to display in the container. For example, you can add rows, columns, images, cards, text, chats - anything that you'd like to display in your browser mockup, including any of the pre-built sections in the parts library.
Adding parts will adjust the container size accordingly.
To change the color of the container underneath, select the container part, and then change the background and foreground colors as needed.
To change the color of the three dots next to the URL, select the browser toolbar. Go to Colors, then change the foreground color to your preferred color. The resulting color will be a paler version of what you selected.
To change the of the top navigation in the window, select the window part. Go to Colors, then change the background color to your preferred color. This will change the color of both the top navigation and the container underneath.
can be set around the window part, and around the container by selecting the relevant part and editing the border property in the right menu.
Text
Customizing and formatting
