Search for stencils, and add them to the page
The stencil library includes a wide range of design elements – from simple shapes to complex user interfaces.
In this article, we’ll show you how to narrow your choice, locate the stencils you need, and add them – as objects – to the page. You’ll also learn how to duplicate and rename those stencils.
Browse Stencil Library
To browse the Stencil library, navigate to the Left Sidebar and click on the Stencils Tab. The tab will turn blue, and will open the Stencils Panel.
As you scroll up and down, you’ll see the Stencil library divided into categories that include both basic and compound stencils. These categories are collapsible and, by clicking on a category name, you can hide or reveal that section.
Basic Stencils are simple shapes and design elements that can be customized for a variety of purposes. You’ll find basic stencils in the following categories: Common, Shapes, Navigation, Charts, Flowcharts Diagrams, UML, Use Case, ERD Model, Spec Tools, and Legacy.
Compound Stencils represent platform-specific elements of a user interface, and reflect that platform’s design language. You’ll find the compound stencil categories grouped by UI Kit: iOS Components, Material Design, and Bootstrap.
To search for a stencil, use the search input at the top of the Stencils Panel. Searches provide results from all stencil categories.
Ctrl/Cmd + F quickly activates the Search input from the active panel.
If a search locates stencils that are ‘hidden’ in collapsed categories, the number of successful results are highlighted in yellow. Click the highlight to reveal the hidden stencils.
Add Stencils to the Page
From the Stencils Panel, there are two ways to add a stencil to your page:
- Drag and drop a stencil to a specific place on the page
- Double-click on the stencil to have it appear in the top-left corner of the page
You can only duplicate stencils once they’ve been added to a page – as objects.
There are two ways to duplicate a stencil:
- While holding down Option/Alt, click and drag a duplicate away from the original
- Ctrl/Cmd + D creates a duplicate on the page
As the complexity of your project grows, renaming your stencils will help keep your project organized – making it easy to identify, and distinguish between other objects on the page.
You can rename any object on the page in two ways:
- At the top of the Format Panel, you’ll find the object’s name in blue text; just click on the text to rename.
- In the Outline Panel, double-click on the object name and type in a new one.
In a later article, we’ll explain how to use the Outline Panel to Group and Organize your stencils quickly and effectively.
Questions & Answers
Moqups doesn’t have the stencil I need. What can I do?
If we don’t have the stencil you’re looking for, there are a couple things you can try:
Create a template: A template is a group of stencils that you have combined and styled – together with icons and images – to create a custom stencil. After creating that custom stencil, you can save it as a template for later reuse.
Upload & add an image: You can upload an image that’s similar to the stencil you need. Then, you can crop, format, adjust the opacity, or remove the background of the image to match your design.