In-app icons

Learn about the types of icons that you can create, how to build and style your icons, and tips and tricks for getting the most from the icons in your application.

This image shows icons in a light theme.

Light theme

This image shows icons in a dark theme.

Dark theme

If you want your app to have a look that’s consistent with BlackBerry 10, we've made it simple for you. You can download the BlackBerry icons that we designed for an action menu or action bar:

BlackBerry 10 Icons

The overview below shows the main steps you can follow to create your icons.

Step 1

Find an appropriate metaphor for the function or physical object that the icon should represent. Try out different variations and pick the one that's easiest to recognize.

Step 2

Create the icon shapes using the information in the Metaphors topic. Use a vector application (such as Adobe Illustrator) and apply the information from the Building blocks topic.

Note where your icon appears in the UI and set up the artboard accordingly. Use pixel units and make sure you use pixel snapping.

Step 3

Import the shape to a pixel application (such as Adobe Photoshop) and keep it as a shape layer. Use snapping and make sure that straight edges are sharp and aligned. If you don't use snapping, nudge the shape points to avoid blurry edges.

Make sure that the canvas is set to the correct width and height.

Apply the treatment rules from the Building blocks topic and save the image as PNG-24 with transparency.

Step 4

Test the icon with other icons, comparing the weight and style.

Put the icon in context and test it on a BlackBerry device.