Develop with Fiori
Fundamentals.

Fiori Fundamentals is SCSS ready! Explore some functions and mixins to maintain consistency & quality of your SCSS.

EXPLORE COMPONENTS      GETTING STARTED
CURRENT VERSION v1.4.0

foundation.

Colors.

Colors bring designs to life. It is used in a meaningful way to express emotions and tone, and promotes a distinct and consistent look and feel throughout all application.

READ MORE
Colors


Grid.

Fiori Fundamentals uses responsive grid system that achieves flexible 12-column flow layout. It is used to create flexible layouts for various screen sizes and device types.

READ MORE
Colors


Spacing.

Spacing helps content to breathe as well as create hierarchy and depth. It ensures optimal readability and space efficiency, all heights and widths are calculated from a base unit or 4.

READ MORE
Colors


Type.

Fiori Fundamentals uses responsive grid system that achieves flexible 12-column flow layout. It is used to create flexible layouts for various screen sizes and device types.

READ MORE
Colors


library.

Popular UI Elements



resources.



Build modern user experiences for products with the SAP look and feel using resources on Github

VIEW ON GITHUB


Have a question? Email us. © Copyright SAP 2018