Intro

Iconography is essential for creating a cohesive and enjoyable app experience. To maintain the look and feel among Fiori design language we advise using the outline icon style provided by Material Design. Download them here.

Usage

Do’s

  • Use Material Design outline icon set.
  • Use icons to highlight important actions for users.
  • Use icons to indicate navigation actions to other screens.

Don’ts

  • Do not use icon sets that are not from the outline Material Design library.
  • Do not use different sized icons.
  • Do not use 3rd party icons.

Design Language

By using the icons provided by Material Design, we leverage the outline icon style, which is similar to the visual style of the Fiori design language.

  • Simple
  • Fresh
  • Neutral
  • Modern

Grid & Pixel Perfection

System Icon Grid

24 x 24 grid (100% scale)
24 x 24 grid (100% scale)
Live area, designated space for your icon
Live area, designated space for your icon
24 x 24 grid (1000% scale)
24 x 24 grid (1000% scale)
Padding space, to provide ample space around your icon
Padding space, to provide ample space around your icon


Pixel Perfection

To avoid having blurry icons, design the icons with full pixels, which means they should have whole number units, with no decimals.

Do
Pixel perfection
Pixel perfection
Don't
Pixelation
Pixelation

Product Icons

Fiori for Android product icons
Fiori for Android product icons

Fiori for Android Product Icons

Fiori for Android product icons are blue outlined icons placed against a white background in order to maintain the SAP Fiori look and feel.

Icon Colors

Blue
#0A6ED1
White
#FFFFFF


Themed product icons
Themed product icons

Themed Product Icons

Product icons can also be themed to allow SAP customers to express their branding. It is recommended that SAP customers use the colors that best represent their brand. For example, a primary color against a secondary neutral color should be clear enough to express a company’s branding.

Product Icon Creation

To learn more about the best practices and process for creating Android product icons refer to the Material Design Product Icons article.