SAP Fiori

What is SAP Fiori?

SAP Fiori is the design language that brings great user experiences to enterprise applications. Based on user roles and business processes, SAP Fiori simplifies doing business.

SAP Fiori elements

SAP Fiori elements is a helpful framework for the most common application patterns that ensures design consistency and compliance with the latest design guidelines.

Discover Beacon

Beacon helps you discover and learn about SAP Fiori. Comprised of bite-sized knowledge nuggets in various formats, Beacon aims to broaden awareness about and increase understanding of SAP Fiori.

The SAP Fiori Design Guidelines

Learn how to design engaging and intuitive apps that can run on any device.

SAP Fiori fundamentals

SAP Fiori fundamentals is a light-weight library of stylesheets and HTML tags that allows developers to build SAP Fiori apps in any web-based UI framework (e.g. Angular, React, Vue, etc.).

Join the Fiori Makers

In this virtual community call series, design-minded SAP partners showcase their SAP Fiori app designs and present their insights from their implementation projects. SAP Design has reviewed these apps and will give additional tips and tricks for creating a great user experience using SAP Fiori.

Most recent SAP Fiori Design discussions
  • SAP Fiori Design

    Master & Detail Floorplan

    Hi, I did not find in the current styleguide: https://experience.sap.com/fiori-design-web/table-bar/ a reference to the master / detail floorplan. Theis floorplan is used by SAP itself,…
    250  |  0  | 
    1 month ago
  • SAP Fiori Design

    Fiori Deployment Option for Central Finance

    We have SAP ECC system with Hub Deployment for Fiori (Separate Gateway system for the Front End).  We are planning to implement Central Finance (Deployment option for S4HANA) with Source as SAP ECC s…
    207  |  0  | 
    1 month ago
  • SAP Fiori Design

    SAP Icons as SVG

    Dear community, are the Icons also available as SVG files? Or only as fonts?  https://sapui5.hana.ondemand.com/sdk/test-resources/sap/m/demokit/iconExplorer/webapp/index.html#/overview/SAP-icons &nbs…
    477  |  1  | 
    2 months ago
  • SAP Fiori Design

    Responsive Table – Mobile / Small Size: Line Break or not

    With Linebreak: Without Linebreak: For me, the guidelines are not clear weather or not there should be a line break after the label or not. With a line break, the user needs to scroll more. without…
    195  |  0  | 
    2 months ago