UI Kits - Overview
Resources / UI Kits / UI Kits - Overview
Intro
The SAP UI kit ecosystem provides a modular foundation for creating consistent, scalable user experiences across SAP products. At its core, it enables product teams to build and extend their own design kits while maintaining visual and functional coherence across applications.
Our design libraries are structured for maximum reusability – leveraging shared components, design tokens, and assets throughout SAP. The UI Kits are organized by component ownership, ensuring flexibility and coverage across various platforms.
The central design library serves as the common foundation and is extended by specialized kits, such as the SAP S/4HANA Web UI Kit and others. These extensions reuse core elements while adapting to specific product or user needs.
[external_only]
SAP Fiori for Web UI Kit
The SAP Fiori for Web UI Kit is the core library that contains common UI components, patterns, and foundation elements, such as colors and typography. It helps accelerate design and development processes and encourages consistency.
[/external_only]
[internal_only]
SAP Web UI Kit
The SAP Web UI Kit is the core library that contains UI common components, patterns, and foundation elements, such as colors and typography. It helps accelerate design and development processes and encourages consistency.
UX Illustration Creation Kit
The UX Illustration Creation Kit enables lines of business to build custom illustrations themselves instead of submitting requests.
It provides a large library of reusable, adaptable assets plus step-by-step guidance and links to existing illustration libraries to support the entire creation process.
[/internal_only]
SAP S/4HANA Web UI Kit
The SAP S/4HANA Web UI Kit enables you to create high-fidelity designs using Figma. This kit helps you rapidly prototype and design SAP Fiori web applications with ease. The kit includes a set of elements for conceptual design purposes.
[internal_only]
SAP AI Web UI Kit
You can use the SAP AI Web UI Kit for Figma to speed up the design and development of AI features for your product. It’s been designed to help you create responsible, accessible, and human-centered AI experiences with ease.
Joule Web UI Kit
SAP’s Joule Web UI Kit includes Joule design foundations, Joule core components, Joule core UX patterns, and Joule content.
[/internal_only]