What’s New in Guideline Version 1.126

Intro

This article provides an overview of the updates to the SAP Fiori web design guidelines with guideline version 1.126.

Look, Feel, and Wording

Topic	Update	Topic Link
Chart Color Palettes	Updated color values, rules, and best practices for the qualitative, sequential, and semantic color palettes.	Chart Color Palettes
Chart Color Palettes – Values and Names	All color values have been updated to Morning Horizon base chart values, as defined in the SAP Theming Base Content repository.	Chart Color Palettes – Values and Names
Design Tokens	The Horizon styles and variables are now included in the UI kits provided by SAP design teams. Updated instructions on how to preview themes or simulate custom theming in Figma.	Design Tokens – Tokens and Style Variable Libraries

AI and Joule Design

Topic	Update	Topic Link
Situation Handling	Updated guidelines and controls for Situation Handling, which helps businesses run smoothly by automatically informing the right users about the issues that require their attention, for example, consumed contracts, pending confirmations and approvals, deviating deliveries, and upcoming deadlines. Users can now see situations displayed in business apps and in an app dedicated to situations. They can also be informed by notifications on SAP Fiori launchpad or by email.	Situation Handling
Situation Handling Controls NEW	Situation Handling comes with multiple controls for the UX pattern of progressive disclosure that improves usability by delivering users information and capabilities gradually. Initially, users see the minimal display for a situation. They can seek additional levels of detail about it, according to their needs and goals.	Situation Handling Controls
Overview in a Situations App NEW	The Situations app displays all situations in a user’s area of responsibility. There are two versions of the app: My Situations – Extended comes with the extended framework for Situation Handling and is the reference app for UX design. My Situations comes with the standard framework for Situation Handling and is a simplified version that contains only a work list.	Overview in a Situations App
Situation Detail View NEW	The situation details view displays the situation with contextual information from the time the situation was created, so that users understand the circumstances that triggered the situation.	Situation Detail View

UI Elements – SAPUI5

Topic	Update	Topic Link
Carousel	You can now set the navigation to move through multiple items or an entire row with a single click on the paging button.	Carousel
Cloud File Browser NEW	The cloud file browser is a dialog composed of controls that allow users to browse through a remote repository, export data to the cloud, or import files from the cloud to an SAP application. The cloud file browser is composed of controls embedded in a dialog.	Cloud File Browser
Object Display Components	Additional guidance for the object number: Don’t use color alone to indicate a value state. Also show an icon that indicates the specific context of the object number.	Object Display Components – Object Number
System Information Bar NEW	With SAP S/4HANA Cloud, customers and partners receive a three-system landscape: a development system, a test system, and a production system. In the development and test systems, the system information bar allows users to quickly identify the system they are using. The system information bar is located above the shell bar. By default, the system information bar is turned on in all non-production systems.	System Information Bar

SAP Fiori Elements Framework

Topic	Update	Topic Link
Object Page Content Area	With both SAP Fiori elements for OData V2 and V4: In applications with Microsoft Team integration, the contact quick view card displays options for starting a Microsoft Teams audio call, video call, or chat with the contact. For sections or subsections that contain a single text area, application teams can enable an option to display the section or subsection title instead of the text area label when the object page is in display mode. With the option enabled, the label is only displayed in edit mode if the field is mandatory.	Object Page Content Area – Contact Facets Object Page Content Area – Section and Subsection Titles
Object Page Header	With both SAP Fiori elements for OData V2 and V4, in applications with Microsoft Teams integration, the contact quick view card displays options for starting a Microsoft Teams audio call, video call, or chat with the contact.	Object Page Header – Contact Facets
Table Toolbar	With both SAP Fiori elements for OData V2 and V4, after users copy data from another SAP Fiori elements application or an external application, they can paste it to: A table Users focus anywhere in the table or select an empty row and paste the data. One or more new rows are created for the pasted data. This feature is available only for draft-enabled applications and for tables where inline creation or the insertion of empty rows has been enabled. A cell or range of cells, only in grid and responsive tables Users select a cell or cell range within the table and paste the data. If the selected cell or cells are in: Active or draft rows, the pasted data replaces the values in those rows. An empty row, new rows are created for the pasted data. To paste, they can use the Paste action in the toolbar or use a keyboard shortcut (Ctrl+V for Microsoft Windows, Cmd+V for MacOS). With SAP Fiori elements for OData V4: The default Copy action in the table toolbar, can now be disabled in all toolbar tables or in or specific ones. The default limit for the number of rows that Export action can export is 1000. The application development team can change the limit.	Table Toolbar – Copy and Paste Table Toolbar – Export

Designer Toolkit

Topic	Update	Topic Link
Download Fonts	SAP icon font: Download files were updated to version 5.9 (Horizon theme) and 4.21 (Quartz theme).	Download Fonts
SAP Fiori for Web UI Kit NEW	The SAP Fiori for Web UI Kit is now available via the SAP space in the Figma Community.	SAP Fiori for Web UI Kit
SAP S/4HANNA Web UI Kit	The SAP S/4HANA Web UI Kit is now published via the Figma Community. The kit includes both cozy and compact form factors.	SAP S/4HANA Web UI Kit

About Guideline Updates

With each new guideline version, we deliver two types of update:

Updates to reflect new or changed UI controls available with SAPUI5 or SAP Web Components.
Ongoing updates on how to best apply the SAP Fiori design (such as patterns, floorplans, and additional decision support). These updates are introduced with a given guideline version, but are not necessarily dependent on a specific SAPUI5 version.

Note: Our policy is to update only the latest guideline version. If you are working with an earlier SAPUI5 release, also consider checking out the most recent guideline version to get the latest general guidance.