What you learned: Add and edit artboards in your XD project
In Adobe XD, artboards represent each of the screens that you design for your mobile app, pages for your website, or other project. When creating a new document, you typically choose an artboard size to start. This creates a single artboard at that size when the new document is created.
Naming artboards helps you keep track of which screen is which in an app design, for instance, or which page is which in a website. To rename an artboard, double-click the name to select it. Then type the name and press Enter or Return.
Changing the size of artboards
Artboards can be resized in a number of ways:
- Using the Select tool, from the Tools panel, click in the artboard to select it. This only works if the artboard is empty. If there’s content already on the artboard, you can click the name above the artboard to select it.
- In the Property Inspector on the right you can see the width and height. You can type in values here to change the dimensions or orientation of the selected artboard.
- Drag any bounding point of a selected artboard to resize it.
Creating new artboards
There are several ways to create new artboards:
- Select an existing artboard and copy it by choosing Edit > Copy and then Edit > Paste.
- Select the Artboard tool and click to create a new artboard at the same size as the selected or default artboard.
- Click the Artboard tool and select a default artboard size from the Property Inspector on the right.
- Select the Artboard tool and draw a new artboard in the document.
Selecting and moving artboards
- Aside from selecting individual artboards, you can also select multiple artboards with the Select tool by dragging across the artboards you would like to select or pressing the Shift key and clicking artboards to add or remove them from the selection.
- Drag artboards to easily align them with other artboards by using the temporary alignment guides that appear.
Tip: You can also select artboards in the Layers panel (View > Layers).