In this guide, we'll cover the fundamentals of all Uizard components management and styling.

Whether you've just started using Uizard and have some questions regarding components management, or you simply want to know how to manage Uizard components more efficiently - you'll definitely find this article insightful 💡

Adding components is extremely easy!

Here's how you can add a component:

1) Click 'Templates' within the left-hand menu:

2) Utilize our component tabs to find what you need or search for it:

3) Click the component and drag and drop it onto your project!

The default components have already had styling suggested by the Uizard AI. It goes without saying that you can customize (or style) them to match your prototype idea. We can make it more enchanting than ever before!

Without further ado, let's do some styling! 😊
​
1) Select any of the components you've previously added.
​
2) Try playing around with various styling settings by clicking the "..." in the in-line toolbar or by clicking the "Design" button on the right-hand menu:

3) You can even make some style changes or upload images from the in-line toolbar. The "Style" button options will differ depending on the type of component you've selected:

Here is a video highlighting some of the styling options you can use:

Do you want to copy-paste a style to another component, or have all similar components have that style?

Here's how to achieve this:

1) Right-click the component you'd like to copy the style of:

2) Click 'Copy style':

3) Right-click the component you'd like to paste the style to:

4) Click 'Paste style':

5) Similarly, you can click 'Paste style to all' to have it pasted to components across the project:

Selecting multiple components within single or multiple screens can be done by:

A) Holding a mouse left-click and dragging the cursor over the components you want to select:
​

B) Holding 'Shift' and clicking the components you want to select:
​

Use the select all keyboard shortcut: 'Cmd' or 'Ctrl' + 'A':

1) Select the components you want to move.

2) Drag and drop selected components or use keyboard arrows:
​

1) Select the components you want to duplicate.

2) Use the standard shortcuts for copy-paste:

Copy - 'Cmd' or 'Ctrl' + 'C'

Paste - 'Cmd' or 'Ctrl' + 'V'

Alternatively, you can also right-click on the selected component(s) and choose 'Copy'. Afterward, right-click anywhere on the empty space of the screen and click 'Paste':
​

1) Select the components you want to group.

2) Right-click on the selected components and choose the 'Group' option:
​

You can fix components into place, i.e. make them stick to either the top or button of the screen in 'Preview' mode, with the 'Stick element when scrolling' option. You can find it as follows:

1) Select the components you want to be fixed.
​
2) Put a checkmark on the 'Stick element when scrolling' option on the right-hand menu:
​

1) Select the components you want to be fixed.

2) Right-click on the selected components and choose the 'Lock component' option:
​

1) Select the components you want to unlock.

2) Right-click on the selected components and choose the 'Unlock component' option:
​

To undo/redo within Uizard, you can:
​
A) Use standard undo/redo keyboard shortcuts:

Undo - 'Cmd' or 'Ctrl' + 'Z'

Redo - 'Cmd' or 'Ctrl' + 'Y'

B) Click on the 'undo' or 'redo' icons on the top menu:
​

The current version of Uizard does not support videos and sounds as components.
​
If you feel like this is a feature that you would like to have, let us know by emailing us at support@uizard.io.

We always consider implementing new features suggested by Uizard users 🙏