With the SAP Fiori for Android 24.4 release, we have made a major upgrade to our Figma Design Kit. The new version includes variables and the latest Figma component settings.

We also have the 72 font files available for download.

Check out the SAP Fiori Mentor app in the Google Play Store to preview and customize components and view code snippets!

What’s New in Design Kit

24.4 Design Kit Revamp

Updated design kit! Major changes have been applied to the SAP Fiori for Android 24.4 Design Kit (formerly known as “UI Kit”):

• Variables: The Design Kit no longer includes dark theme variants and properties; however, they can be accessed via the Figma variables. The supported variable collections include:
  • Color Modes: light mode and dark mode
  • Semantic Colors: negative, positive, critical, neutral, and informative
  • Accent Colors: a variety of accent label colors and corresponding background colors
  • Icon Sizes: a set of sizes with 2dp incremental – 2, 4, 6, 8, 10, 12, 14, 16, 18, 20, 22, 24, 32 (dp)

• Page hierarchy: The page hierarchy has been updated to better display the available components in a plain list that is organized in an alphabetical order. The hierarchy includes three levels: general categories, component groups and component pages.

• In-page layout: The page layout has been updated to provide more detailed information in the information card, better separation between the master component and the subcomponents. Example screens are placed on the right side to showcase the component possibilities.

• Component enhancement: Most of the components’ properties have been updated with more flexibility to make sure the configurable features are easy to find and easy to change.

Design Kit

Figma Design Kit (SAP Fiori with Horizon Theme)

SAP Fiori for Android 24.4 – Design Kit Figma File

Updated on April 12, 2024

Sketch Stencils (Fiori Quartz)

SAP Fiori for Android Stencils – Mobile

Uploaded on July 8, 2021

SAP Fiori for Android Stencils – Tablet

Uploaded on July 8, 2021

Icons

We recommend using icons from the new SAP icons. Please refer to Iconograry for more details.

If you need icons that are not provided in the SAP icons, the Material Design icon library is available for downloading icons to use on SAP Fiori for Android applications.

Material Design Outlined Icons Library

72 Font

The 72 font download is made available under the Apache 2.0 license.

72 Font for Desktop

72 Font for Web