The SAP Fiori launchpad is an SAPUI5-based application that acts like an application container (called a shell) and is used to host multiple SAP Fiori apps (e.g., SAPUI5 components, Web Dynpro ABAP components, SAP GUI for HTML for running SAP GUI transactions, web client UIs, and arbitrary URLs).
It serves as an entry point to all these application types and related analytical insights that can be viewed or accessed on various devices with an adaptive design paradigm, as shown in this figure.
Along with the shell that provide access to applications and insights, the SAP Fiori launchpad also provides additional services such as navigation, personalization, embedded help, bookmarking, app configuration, notifications, usage analytics, and user info.
The access to these applications and the analytical insights are represented as tiles and links on the launchpad, which are used to launch the corresponding applications within the launchpad shell. The figure below shows tiles (e.g., Manage Sales Orders, Track Sales Order) in the first row and links (e.g., Create Sales Order, Sales Order Fulfillment) in the second row.
They can also be configured to open applications in-place (within the same browser tab) or ex-place (outside the tab, in a new tab).
1
The SAP Fiori launchpad presents different views to individual users based on the roles assigned to them and any personalizations. These roles are typically modeled on segregation of duties (SoD) compliance; that is, they are typically like a job description in an organization for an employee, manager, or purchaser and present only the relevant information required for the user to do their daily tasks. Let’s explore the role the SAP Fiori Launchpad plays, introduced through different variants, and discuss the key components.
The SAP Fiori launchpad started as a single entry point option for accessing a specific product (or a couple of similar related products, for example, SAP ERP and SAP SRM, both based on SAP NetWeaver) in the past, and it evolved as a central entry point option with a motivation to integrate multiple cross products, for example, SAP SuccessFactors, SAP Concur, SAP Ariba, SAP Customer Experience, and SAP Enterprise Portal, as shown in the next figure. The SAP Fiori launchpad not only gives options to launch and access multiple UIs from one place when acting as a shell but also provides federation capability to share preconfigured SAP Fiori Launchpad content and roles.
From the usage point of view, the SAP Fiori launchpad typically serves as a starting entry point for all the SAP Fiori business processes coverage that the user can access. It shows various application tiles/links and analytical information, such as counters, key performance indicators (KPIs) via graphs, and charts, on tiles.
From the launchpad, users typically access domain-specific information and actions via an analytical or drilldown-based app as a second step and finally reach the object-level transaction to execute operations on the business objects.
Consider the next figure for understanding navigation as part of the SAP S/4HANA SAP Fiori UX. The first level shows the SAP Fiori launchpad serving as the start point, the second level shows an overview page (e.g., procurement area), and the third level shows the Purchase Contract and the Display FLC Order apps that a user would use to deep dive.
1
In a generation use case, starting from the launchpad at level 1, the user would topically access the analytical apps, such as overview pages, list reports, worklists, analytical list pages, at level 2, and then eventually jump to specific business objects at level 3.
Now that you have an understanding of the SAP Fiori launchpad, let’s investigate its variants available across different platforms. The following variants are available.
This variant of the SAP Fiori launchpad is implemented as a part of the SAP_UI component on an SAP NetWeaver or ABAP platform and is typically launched by Transaction /UI2/FLP from the relevant client or via a launchpad URL provided by the system admins.
The SAP Fiori launchpad typically uses an SAP Gateway frontend component (IW_FND - Information Worker Foundation) to register the OData services, and the business enablement provisioning (IW_BEP) component is used to consume the data services. The launchpad itself is an SAPUI5-based application that requires few OData services to operate.
The SAP Fiori launchpad content is assigned to users via Transaction PFCG role assignments. And the SAP Fiori launchpad content is modeled via tools such as the SAP Fiori launchpad designer and the SAP Fiori launchpad content manager.
This variant of the SAP Fiori launchpad is based on a multichannel portal framework page (called SAP Fiori framework page) that gives you the SAP Fiori launchpad experience within the SAP Enterprise Portal environment. The SAP Fiori launchpad content is administered using the SAP Enterprise Portal roles concepts and is modeled using the portal content directory structure.
This variant of the SAP Fiori launchpad is implemented via SAP BTP (formerly known as SAP Cloud Platform) software as a service (SaaS) launchpad or portal service and is accessed via a site URL provided by system admins.
The SAP Fiori launchpad content is assigned to users via SAP BTP roles and is modeled using site manager.
The table below shows a comparison of these implementations and what they support.
SAP Fiori launchpad is a shell page from which all SAP Fiori apps can be accessed. It can be customized using a tool called the UI Theme Designer. The UI Theme Designer isn’t just for SAP Fiori, but also functions as a tool for cross-theming scenarios, supporting many platforms and technologies.
For example, when you create a theme for SAP Fiori launchpad, you can apply the same theme to SAP Fiori applications, Web Dynpro ABAP, Floorplan Manager (FPM), and SAP Business Client.
UI Theme Designer is a browser-based tool with a WYSIWYG designer (what you see is what you get); therefore, any change that you make can be viewed immediately in the browser. Using the UI Theme Designer, you can create your own themes to reflect your corporate identity, corporate colors, and company logo.
Below shows the SAP Fiori launchpad architecture with the UI Theme Designer. The top layer shows the UI Theme Designer built on SAPUI5. The UI theme repository on the ABAP front-end server contains SAP standard themes and custom themes.
Each time you create a custom theme, UI Theme Designer generates LESS files, CSS files, and images, which are saved into the repository. These files are received via HTTP calls. The application is loaded with the CSS files from a chosen custom theme.
The following are the transaction codes you’ll be using while working with UI Theme
Designer:
Now that you have an overview of UI Theme Designer, let’s look at how to create themes for SAP Fiori launchpad.
In this section, we’ll show you how to create a new theme for SAP Fiori launchpad and how to apply it to the default template. To do so, follow these steps:
Note: you can create a custom theme only on a base theme. For example, in the previous step, to create a new custom theme we started with the SAP Belize theme.
Enter the link to the application. In our example, we want to change the theme of SAP Fiori launchpad, so enter the SAP Fiori launchpad URL (see next figure). You can also provide a name for the application, but doing so is optional.
UI Theme Designer provides various options for theming, depending on the developers skill level in CSS (1) (see next figure).
*These experimental features, which aren’t for productive use, may be changed by SAP at any time.
You can toggle between Original and Preview modes to compare your changed version with the original version (2).
You can select between different layouts—Desktop, Mobile, or Tablet—to simulate your changes on different device types (3).
Next, let’s look at some of the options in Quick theming that can help you change the look and feel of SAP Fiori launchpad.
With the Quick theming option, you can change background colors, fonts, and images. Here, as shown in the next figure, we’ll add a custom logo using the Quick theming tool and replace the standard SAP images. Similarly, you can change the text colors, fonts, and so on (see second figure below).
Next, let’s look at the Expert theming tool. To use this tool, select the Expert option, then enter “icon” in the search box to filter the objects.
You can change the color for the sapContent_IconColor field, which will change the color of the icons in a tile. Your output should reflect all the changes you’ve made until now, and you can toggle between the Original and Preview mode.
The next task is to save and publish the changes to the ABAP front-end server. Follow these steps:
1. Click on Theme > Save & Build.
2. Enter the Theme ID and the Title, then click OK.
3. After the custom theme is saved and built, you should see a message something like the one below. Click OK.
You’ve successfully created a custom theme and uploaded it to the ABAP front-end server. Next, you’ll have to test the custom theme by following these steps:
1. Log in to the ABAP front-end sever, and run Transaction UI5/THEME_TOOL.
2. Scroll down or search for your custom theme.
3. Double-click Info.
4. Copy the URL and paste it at the end of the SAP Fiori launchpad URL, prefaced by an ampersand (&).Your url should look something similar to what we have below, and once you run this url in the browser, you should see the new custom theme applied to your SAP Fiori Launchpad:
https://<host>.<domain>:<port>/sap/bc/ui5_ui5/ui2/ushell/shells/abap/Fiorilaunchpad.html?sap-theme=CorporateTheme&http://nbcloud.nineboards.com:50000/sap/public/bc/themes/~client-120/~cache-2VCj7NrjFnVxuDZ8vm6HqrJVPsI
5. The next step is to overwrite the standard theme with the custom theme, which you created in the previous steps. Run Transaction /UI2/NWBC_CFG_SAP.
6. Set the SAP_FLP parameter value to the name of the custom theme you created previously.
You should now see SAP Fiori launchpad with the new theme in place.
Important! Whenever you apply a patch, make sure you check whether your custom theme is working without any issues. If you come across any issues, you may have to rebuild your theme with UI Theme Designer.
In this blog post, you learned about the SAP Fiori launchpad: what it is, how you can customize it with the UI Theme Designer, and how to create a custom theme for your SAP Fiori dashboard.
Editor’s note: This post has been adapted from sections of the books SAP Fiori: Implementation and Development by Souvik Roy, Aleksandar Debelic, and Gairik Acharya and Configuring SAP Fiori Launchpad by Claus Burgaard and Setu Saxena. Souvik is a senior application engineer at Google. He has more than 17 years of experience in various technical areas in SAP. Aleksandar is an SAP technical architect at IBM. He has more than 20 years of SAP experience, primarily as a technical solution architect and technology team lead. Gairik is a senior technical architect and associate partner at IBM with more than 20 years of IT experience. Claus is a UX and mobility expert with more than 20 years of technical experience at SAP. Setu is a UX architect at SAP Denmark. He has more than nine years of experience working with SAP.
This post was originally published 3/2022 and updated 8/2025.