Skip to Content
Product Information
Author's profile photo Joseph Chinnabathini

How to get Fiori 3 Quartz theme without upgrading to S/4HANA 1909

In this blog, I would like to explain about applying Quartz theme without upgrading to S/4HANA. This is for the users who don’t want to upgrade 1909 but wanted to have Fiori 3 Quartz theme with mostly grey and neutral with more focussing on user experience with better look and feel. Applications really look nice bright colors.

3 Simple Steps: It’s simple change by modifiying properties in theme designer and adding custom css to it.

  1. Create a custom theme based on template Belize.

2. Change the Brand Color (#32363a), Base Color(#eff4f9), Highlight Color(#32363a) ,Background color (#eaedee), Background Image(#eaedee), Header Color(#354a5f), Text Color (#1a1c1f)& Custom CSS if required

.sapUshellAnchorNavigationBar {
background: #ffffff;
}
.sapMGTHdrTxt>.sapMText {
color: #32363a;
font-weight: normal;
font-family: “72”,”72full”,Arial,Helvetica,sans-serif;
font-size: 1rem;
}
.sapUshellShellHeadItm > span {
font-weight: normal;
font-size: 1.125rem;
color: #d1e8ff;
text-shadow: rgb(255, 255, 255) 0px 0px 0.125rem;
border-radius: 50%;
}
.sapUshellHeadTitle {
color: #ffffff;
}

 

 

3. Save & Build the theme. Now switch to newly built Quartz look and feel.

Have fun with new Fiori 3 Quartz theme in Fiori 2.0 🙂

Assigned Tags

      4 Comments
      You must be Logged on to comment or reply to a post.
      Author's profile photo Jocelyn Dart
      Jocelyn Dart

      Hi Joseph, Nice summary.

      Just remember that this will ONLY change the colours. It doesn't change any of the behaviours to new Fiori 3 design behaviours.

      And if you use this you still need to check all your apps are ok with the new colour scheme - especially if you have custom apps with CSS overrides

      Thanks

      Jocelyn

      Author's profile photo Joseph Chinnabathini
      Joseph Chinnabathini
      Blog Post Author

      Absolutely Jocelyn, this is just to give look and feel of Fiori 3, rest everything remains same.

      Author's profile photo Balamurugan Lakshmanan
      Balamurugan Lakshmanan

      Can you get the Quartz Theme and Fiori Elements by upgrading the SAP UI5 version to 1.65 and still remain on S/4 HANA 1809, Fiori 2.0??

      Author's profile photo Alexandre Sabatier
      Alexandre Sabatier

      Nope.