CINXE.COM

<!DOCTYPE html><html lang="en-us"><head><meta charSet="utf-8"/><meta name="viewport" content="width=device-width"/><script data-ui5-config="true" type="application/json">{"theme":"sap_horizon"}</script><script async="" src="https://assets.adobedtm.com/ccc66c06b30b/69c779d15421/launch-e004d02e792c.min.js"></script><script>window.schema_highlighter={"accountId":"Acronym/GroupsCommunitySAP","outputCache":true}</script><script async="" src="https://cdn.schemaapp.com/javascript/highlight.js"></script><title>SAP Fiori Elements | SAP Community</title><meta name="description" content="Join the community to ask questions, share tips, and find resources on streamlining the app building experience for developers using SAP Fiori elements."/><meta name="sm_tech_ids" content="en-us,ed5c1ef6-932f-4c19-b2ba-1be375109ff5"/><meta name="created_timestamp" content="2021-11-27T06:31:23.948Z"/><meta name="updated_timestamp" content="2024-01-09T10:07:29.179Z"/><meta name="keywords" content="sap fiori elements, fiori elements, sap fe, fe"/><link rel="preload" as="image" imageSrcSet="/_next/image?url=https%3A%2F%2Fpages.community.sap.com%2Fimages%2Fbltd2cec5a5ddf00594%2Flogo_k4u_ohnetypo-1.png&w=640&q=75 640w, /_next/image?url=https%3A%2F%2Fpages.community.sap.com%2Fimages%2Fbltd2cec5a5ddf00594%2Flogo_k4u_ohnetypo-1.png&w=750&q=75 750w, /_next/image?url=https%3A%2F%2Fpages.community.sap.com%2Fimages%2Fbltd2cec5a5ddf00594%2Flogo_k4u_ohnetypo-1.png&w=828&q=75 828w, /_next/image?url=https%3A%2F%2Fpages.community.sap.com%2Fimages%2Fbltd2cec5a5ddf00594%2Flogo_k4u_ohnetypo-1.png&w=1080&q=75 1080w, /_next/image?url=https%3A%2F%2Fpages.community.sap.com%2Fimages%2Fbltd2cec5a5ddf00594%2Flogo_k4u_ohnetypo-1.png&w=1200&q=75 1200w, /_next/image?url=https%3A%2F%2Fpages.community.sap.com%2Fimages%2Fbltd2cec5a5ddf00594%2Flogo_k4u_ohnetypo-1.png&w=1920&q=75 1920w, /_next/image?url=https%3A%2F%2Fpages.community.sap.com%2Fimages%2Fbltd2cec5a5ddf00594%2Flogo_k4u_ohnetypo-1.png&w=2048&q=75 2048w, /_next/image?url=https%3A%2F%2Fpages.community.sap.com%2Fimages%2Fbltd2cec5a5ddf00594%2Flogo_k4u_ohnetypo-1.png&w=3840&q=75 3840w" imageSizes="100vw" fetchpriority="high"/><link rel="preload" href="https://pages.community.sap.com/images/bltc2a2754b4a07b51d/281738-pictogram-blue-1.svg" as="image" fetchpriority="high"/><link rel="preload" as="image" imageSrcSet="/_next/image?url=https%3A%2F%2Fpages.community.sap.com%2Fimages%2Fbltd5a8b08ba735aa3c%2F281091-1.png&w=640&q=75 640w, /_next/image?url=https%3A%2F%2Fpages.community.sap.com%2Fimages%2Fbltd5a8b08ba735aa3c%2F281091-1.png&w=750&q=75 750w, /_next/image?url=https%3A%2F%2Fpages.community.sap.com%2Fimages%2Fbltd5a8b08ba735aa3c%2F281091-1.png&w=828&q=75 828w, /_next/image?url=https%3A%2F%2Fpages.community.sap.com%2Fimages%2Fbltd5a8b08ba735aa3c%2F281091-1.png&w=1080&q=75 1080w, /_next/image?url=https%3A%2F%2Fpages.community.sap.com%2Fimages%2Fbltd5a8b08ba735aa3c%2F281091-1.png&w=1200&q=75 1200w, /_next/image?url=https%3A%2F%2Fpages.community.sap.com%2Fimages%2Fbltd5a8b08ba735aa3c%2F281091-1.png&w=1920&q=75 1920w, /_next/image?url=https%3A%2F%2Fpages.community.sap.com%2Fimages%2Fbltd5a8b08ba735aa3c%2F281091-1.png&w=2048&q=75 2048w, /_next/image?url=https%3A%2F%2Fpages.community.sap.com%2Fimages%2Fbltd5a8b08ba735aa3c%2F281091-1.png&w=3840&q=75 3840w" imageSizes="100vw" fetchpriority="high"/><link rel="preload" as="image" imageSrcSet="/_next/image?url=https%3A%2F%2Fpages.community.sap.com%2Fimages%2Fblt4c969072e7bf2b7b%2F283063_Media_center_R_blue-1.png&w=640&q=75 640w, /_next/image?url=https%3A%2F%2Fpages.community.sap.com%2Fimages%2Fblt4c969072e7bf2b7b%2F283063_Media_center_R_blue-1.png&w=750&q=75 750w, /_next/image?url=https%3A%2F%2Fpages.community.sap.com%2Fimages%2Fblt4c969072e7bf2b7b%2F283063_Media_center_R_blue-1.png&w=828&q=75 828w, /_next/image?url=https%3A%2F%2Fpages.community.sap.com%2Fimages%2Fblt4c969072e7bf2b7b%2F283063_Media_center_R_blue-1.png&w=1080&q=75 1080w, /_next/image?url=https%3A%2F%2Fpages.community.sap.com%2Fimages%2Fblt4c969072e7bf2b7b%2F283063_Media_center_R_blue-1.png&w=1200&q=75 1200w, /_next/image?url=https%3A%2F%2Fpages.community.sap.com%2Fimages%2Fblt4c969072e7bf2b7b%2F283063_Media_center_R_blue-1.png&w=1920&q=75 1920w, /_next/image?url=https%3A%2F%2Fpages.community.sap.com%2Fimages%2Fblt4c969072e7bf2b7b%2F283063_Media_center_R_blue-1.png&w=2048&q=75 2048w, /_next/image?url=https%3A%2F%2Fpages.community.sap.com%2Fimages%2Fblt4c969072e7bf2b7b%2F283063_Media_center_R_blue-1.png&w=3840&q=75 3840w" imageSizes="100vw" fetchpriority="high"/><meta name="next-head-count" content="16"/><style type="text/css" data-ui5-font-face=""></style><link rel="icon" href="/assets/icons/favicon.ico"/><link rel="apple-touch-icon" sizes="60x60" href="/assets/icons/touch-icon-60x60.png"/><link rel="apple-touch-icon" sizes="120x120" href="/assets/icons/touch-icon-120x120.png"/><link rel="apple-touch-icon" sizes="180x180" href="/assets/icons/touch-icon-180x180.png"/><link rel="preload" href="/_next/static/media/f4236f0f9d94f2de-s.p.woff2" as="font" type="font/woff2" crossorigin="anonymous" data-next-font="size-adjust"/><link rel="preload" href="/_next/static/media/ebad0b29b9a68b51-s.p.woff2" as="font" type="font/woff2" crossorigin="anonymous" data-next-font="size-adjust"/><link rel="preload" href="/_next/static/css/c7c4986e6c80843c.css" as="style" crossorigin=""/><link rel="stylesheet" href="/_next/static/css/c7c4986e6c80843c.css" crossorigin="" data-n-g=""/><link rel="preload" href="/_next/static/css/e19116cbaf07bf7b.css" as="style" crossorigin=""/><link rel="stylesheet" href="/_next/static/css/e19116cbaf07bf7b.css" crossorigin="" data-n-p=""/><link rel="preload" href="/_next/static/css/27ed42223a548385.css" as="style" crossorigin=""/><link rel="stylesheet" href="/_next/static/css/27ed42223a548385.css" crossorigin="" data-n-p=""/><noscript data-n-css=""></noscript><script defer="" crossorigin="" nomodule="" src="/_next/static/chunks/polyfills-c67a75d1b6f99dc8.js"></script><script src="/_next/static/chunks/webpack-4e2ee09b92c22f7d.js" defer="" crossorigin=""></script><script src="/_next/static/chunks/framework-4dba13e6edeb3afc.js" defer="" crossorigin=""></script><script src="/_next/static/chunks/main-f69a8c7496dce020.js" defer="" crossorigin=""></script><script src="/_next/static/chunks/pages/_app-9154c2181d2e3e8b.js" defer="" crossorigin=""></script><script src="/_next/static/chunks/a27de39d-15fc28df7c5d15e4.js" defer="" crossorigin=""></script><script src="/_next/static/chunks/7bc76ba6-c15ed296a9908df0.js" defer="" crossorigin=""></script><script src="/_next/static/chunks/7477-aaeea327a9c0778c.js" defer="" crossorigin=""></script><script src="/_next/static/chunks/3817-3bf79efaf2a8fe56.js" defer="" crossorigin=""></script><script src="/_next/static/chunks/6747-251273e796da8ed9.js" defer="" crossorigin=""></script><script src="/_next/static/chunks/2314-20e914092b8d4197.js" defer="" crossorigin=""></script><script src="/_next/static/chunks/4102-93f285b58daa80d3.js" defer="" crossorigin=""></script><script src="/_next/static/chunks/2074-3f48bd05a1dc4a8a.js" defer="" crossorigin=""></script><script src="/_next/static/chunks/4152-fe8d656f9c32aaec.js" defer="" crossorigin=""></script><script src="/_next/static/chunks/pages/topics/%5Btitle%5D-c56e0da9108d2325.js" defer="" crossorigin=""></script><script src="/_next/static/3752/_buildManifest.js" defer="" crossorigin=""></script><script src="/_next/static/3752/_ssgManifest.js" defer="" crossorigin=""></script><style id="server-side-styles"> .inheritingSapScrollBar *:not([data-native-scrollbar])::-webkit-scrollbar { background-color: var(--sapScrollBar_TrackColor); } .inheritingSapScrollBar *:not([data-native-scrollbar])::-webkit-scrollbar-thumb { border-radius: 0.25rem; background-color: var(--sapScrollBar_FaceColor); } .inheritingSapScrollBar *:not([data-native-scrollbar])::-webkit-scrollbar-corner { background-color: var(--sapScrollBar_TrackColor); } .inheritingSapScrollBar *:not([data-native-scrollbar])::-webkit-scrollbar-thumb:hover { background-color: var(--sapScrollBar_Hover_FaceColor); } .inheritingSapScrollBar *:not([data-native-scrollbar])::-webkit-scrollbar-thumb:horizontal { height: var(--sapScrollBar_Dimension); } .inheritingSapScrollBar *:not([data-native-scrollbar])::-webkit-scrollbar-thumb:vertical { width: var(--sapScrollBar_Dimension); } .inheritingSapScrollBar *:not([data-native-scrollbar])::-webkit-scrollbar:horizontal { height: var(--sapScrollBar_Dimension); } .inheritingSapScrollBar *:not([data-native-scrollbar])::-webkit-scrollbar:vertical { width: var(--sapScrollBar_Dimension); } .sapScrollBar:not([data-native-scrollbar])::-webkit-scrollbar { background-color: var(--sapScrollBar_TrackColor); } .sapScrollBar:not([data-native-scrollbar])::-webkit-scrollbar-thumb { border-radius: 0.25rem; background-color: var(--sapScrollBar_FaceColor); } .sapScrollBar:not([data-native-scrollbar])::-webkit-scrollbar-corner { background-color: var(--sapScrollBar_TrackColor); } .sapScrollBar:not([data-native-scrollbar])::-webkit-scrollbar-thumb:hover { background-color: var(--sapScrollBar_Hover_FaceColor); } .sapScrollBar:not([data-native-scrollbar])::-webkit-scrollbar-thumb:horizontal { height: var(--sapScrollBar_Dimension); } .sapScrollBar:not([data-native-scrollbar])::-webkit-scrollbar-thumb:vertical { width: var(--sapScrollBar_Dimension); } .sapScrollBar:not([data-native-scrollbar])::-webkit-scrollbar:horizontal { height: var(--sapScrollBar_Dimension); } .sapScrollBar:not([data-native-scrollbar])::-webkit-scrollbar:vertical { width: var(--sapScrollBar_Dimension); } :root { --_ui5wcr-BarHeight: 2.75rem; --_ui5wcr-SplitterSize: 1rem; --_ui5wcr-ElementHeight: var(--sapElement_Height); --_ui5wcr-ToolbarHeight: 2.75rem; --_ui5wcr-DialogHeaderHeight: 2.75rem; --_ui5wcr_Splitter_IconColor: var(--sapButton_Lite_TextColor); --_ui5wcr-CheckBoxWidthHeight: 2.75rem; --_ui5wcr_Splitter_BarOutline: none; --_ui5wcr_Toolbar_FocusShadow: none; --_ui5wcr-FormGroupTitleHeight: 2.75rem; --_ui5wcr_Toolbar_FocusOutline: var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--sapContent_FocusColor); --_ui5wcr-DialogSubHeaderHeight: 3rem; --_ui5wcr-ButtonTopBottomPadding: 0.25rem 0; --_ui5wcr-ToolbarSeparatorHeight: 2rem; --_ui5wcr_Splitter_BarBorderFocus: var(--sapContent_FocusWidth) solid var(--sapContent_FocusColor); --_ui5wcr_Splitter_BarBorderStyle: none; --_ui5wcr-AnalyticalTableRowHeight: 44px; --_ui5wcr_ActionSheet_HeaderBoxShadow: none; --_ui5wcr_ObjectPage_SectionBorderTop: 0.0625rem solid var(--sapGroup_TitleBorderColor); --_ui5wcr_Splitter_ContentBorderColor: var(--sapHighlightColor); --_ui5wcr-ToolbarPopoverContentPadding: 0.25rem 0.5rem; --_ui5wcr_ObjectPage_PaddingBlockStart: 2rem; --_ui5wcr_ObjectPage_SectionTitleHeight: 2.25rem; --_ui5wcr-AnalyticalTableHeaderRowHeight: 44px; --_ui5wcr-AnalyticalTableExpandIconHeight: 1rem; --_ui5wcr-MessageViewListItemHeightByLine: 3.325rem; --_ui5wcr-MessageViewListItemHeightSingle: 2.75rem; --_ui5wcr-AnalyticalTable-HeaderFontFamily: var(--sapFontFamily); --_ui5wcr-AnalyticalTable-OuterBorderBlock: 1px solid var(--sapList_BorderColor); --_ui5wcr-AnalyticalTableTreePaddingLevel1: 1.5rem; --_ui5wcr-AnalyticalTableTreePaddingLevel2: 2.25rem; --_ui5wcr-AnalyticalTableTreePaddingLevel3: 2.75rem; --_ui5wcr-AnalyticalTable-HeaderBorderWidth: 0.0625rem; --_ui5wcr-AnalyticalTable-OuterBorderInline: 1px solid var(--sapList_BorderColor); --_ui5wcr-AnalyticalTableExpandButtonHeight: 2.25rem; --_ui5wcr_ActionSheet_MobileHeaderBoxShadow: none; --_ui5wcr_ActionSheet_MobileHeaderTextColor: var(--sapContent_ContrastTextColor); --_ui5wcr_ObjectPage_SectionTitleFontFamily: var(--sapFontFamily); --_ui5wcr_ObjectPage_SectionTitleLineHeight: 2.25rem; --_ui5wcr_ObjectPage_SubSectionBorderRadius: 0; --_ui5wcr_Splitter_BarBorderHighContrastFix: var(--sapContent_FocusWidth) solid var(--sapContent_FocusColor); --_ui5wcr_ActionSheet_MobileHeaderBackground: transparent; --_ui5wcr-AnalyticalTableSelectionColumnWidth: 44px; --_ui5wcr_ActionSheet_MobileHeaderBorderRadius: 0; --_ui5wcr_ObjectPage_SubSectionBackgroundColor: transparent; --_ui5wcr-AnalyticalTable-HeaderActiveTextColor: var(--sapList_HeaderTextColor); --_ui5wcr_ObjectPage_SectionTitleTextDecoration: none; } [data-ui5-compact-size], .ui5-content-density-compact, .sapUiSizeCompact { --_ui5wcr-BarHeight: 2.5rem; --_ui5wcr-ElementHeight: var(--sapElement_Compact_Height); --_ui5wcr-ToolbarHeight: 2rem; --_ui5wcr-DialogHeaderHeight: 2.5rem; --_ui5wcr-CheckBoxWidthHeight: 2rem; --_ui5wcr-FormGroupTitleHeight: 2rem; --_ui5wcr-DialogSubHeaderHeight: 2.25rem; --_ui5wcr-ButtonTopBottomPadding: 0.1875rem 0; --_ui5wcr-ToolbarSeparatorHeight: 1.5rem; --_ui5wcr-AnalyticalTableRowHeight: 32px; --_ui5wcr-ToolbarPopoverContentPadding: 0.1875rem 0.375rem; --_ui5wcr-AnalyticalTableHeaderRowHeight: 32px; --_ui5wcr-AnalyticalTableExpandIconHeight: 0.75rem; --_ui5wcr-MessageViewListItemHeightByLine: 3.25rem; --_ui5wcr-MessageViewListItemHeightSingle: 2rem; --_ui5wcr-AnalyticalTableTreePaddingLevel1: 1rem; --_ui5wcr-AnalyticalTableTreePaddingLevel2: 1.5rem; --_ui5wcr-AnalyticalTableTreePaddingLevel3: 2rem; --_ui5wcr-AnalyticalTableExpandButtonHeight: 1.5rem; --_ui5wcr-AnalyticalTableSelectionColumnWidth: 32px; } [data-sap-theme="sap_belize"] { --_ui5wcr_ActionSheet_BoxShadow: var(--sapContent_HeaderShadow); --_ui5wcr_Splitter_BarBorderFocus: .0625rem dotted var(--sapContent_FocusColor); --_ui5wcr_ActionSheet_TopBorderRadius: var(--sapElement_BorderCornerRadius); --_ui5wcr_Splitter_BarBorderHighContrastFix: .0625rem dotted var(--sapContent_FocusColor); } [data-sap-theme="sap_belize_hcb"] { --_ui5wcr_ActionSheet_BoxShadow: var(--sapContent_HeaderShadow); --_ui5wcr_ActionSheet_TopBorderRadius: var(--sapElement_BorderCornerRadius); } [data-sap-theme="sap_belize_hcw"] { --_ui5wcr_ActionSheet_BoxShadow: var(--sapContent_HeaderShadow); --_ui5wcr_ActionSheet_TopBorderRadius: var(--sapElement_BorderCornerRadius); } [data-sap-theme="sap_fiori_3"] { --_ui5wcr_ActionSheet_BoxShadow: var(--sapContent_HeaderShadow); --_ui5wcr_Splitter_BarBorderFocus: .0625rem dotted var(--sapContent_FocusColor); --_ui5wcr_ActionSheet_TopBorderRadius: var(--sapElement_BorderCornerRadius); --_ui5wcr_Splitter_BarBorderHighContrastFix: .0625rem dotted var(--sapContent_FocusColor); } [data-sap-theme="sap_fiori_3_dark"] { --_ui5wcr_ActionSheet_BoxShadow: var(--sapContent_HeaderShadow); --_ui5wcr_Splitter_BarBorderFocus: .0625rem dotted var(--sapContent_FocusColor); --_ui5wcr_ActionSheet_TopBorderRadius: var(--sapElement_BorderCornerRadius); --_ui5wcr_Splitter_BarBorderHighContrastFix: .0625rem dotted var(--sapContent_FocusColor); } [data-sap-theme="sap_fiori_3_hcb"] { --_ui5wcr_Splitter_BarOutline: 0.15rem dotted var(--sapGroup_ContentBorderColor); --_ui5wcr_ActionSheet_BoxShadow: var(--sapContent_HeaderShadow); --_ui5wcr_Splitter_BarBorderFocus: solid var(--sapGroup_ContentBorderColor) 0.0625rem; --_ui5wcr_Splitter_BarBorderStyle: solid var(--sapGroup_ContentBorderColor) 0.0625rem; --_ui5wcr_ActionSheet_TopBorderRadius: var(--sapElement_BorderCornerRadius); --_ui5wcr_Splitter_ContentBorderColor: var(--sapGroup_ContentBorderColor); --_ui5wcr_Splitter_BarBorderHighContrastFix: none; } [data-sap-theme="sap_fiori_3_hcw"] { --_ui5wcr_Splitter_BarOutline: 0.15rem dotted var(--sapGroup_ContentBorderColor); --_ui5wcr_ActionSheet_BoxShadow: var(--sapContent_HeaderShadow); --_ui5wcr_Splitter_BarBorderFocus: solid var(--sapGroup_ContentBorderColor) 0.0625rem; --_ui5wcr_Splitter_BarBorderStyle: solid var(--sapGroup_ContentBorderColor) 0.0625rem; --_ui5wcr_ActionSheet_TopBorderRadius: var(--sapElement_BorderCornerRadius); --_ui5wcr_Splitter_ContentBorderColor: var(--sapGroup_ContentBorderColor); --_ui5wcr_Splitter_BarBorderHighContrastFix: none; } [data-sap-theme="sap_horizon"] { --_ui5wcr_Toolbar_FocusShadow: inset 0 0 0 0.125rem var(--sapContent_FocusColor); --_ui5wcr_Toolbar_FocusOutline: none; --_ui5wcr_ActionSheet_HeaderBoxShadow: var(--sapContent_HeaderShadow); --_ui5wcr_ObjectPage_SectionBorderTop: none; --_ui5wcr_Splitter_ContentBorderColor: var(--sapGroup_ContentBorderColor); --_ui5wcr_ObjectPage_PaddingBlockStart: 0.5rem; --_ui5wcr_ObjectPage_SectionTitleHeight: 2.75rem; --_ui5wcr-AnalyticalTable-HeaderFontFamily: var(--sapFontBoldFamily); --_ui5wcr-AnalyticalTable-OuterBorderBlock: none; --_ui5wcr-AnalyticalTable-OuterBorderInline: none; --_ui5wcr_ActionSheet_MobileHeaderBoxShadow: var(--sapContent_Shadow2); --_ui5wcr_ActionSheet_MobileHeaderTextColor: var(--sapPageHeader_TextColor); --_ui5wcr_ObjectPage_SectionTitleFontFamily: var(--sapFontBoldFamily); --_ui5wcr_ObjectPage_SectionTitleLineHeight: 4rem; --_ui5wcr_ObjectPage_SubSectionBorderRadius: var(--sapElement_BorderCornerRadius); --_ui5wcr_ActionSheet_MobileHeaderBackground: var(--sapPageHeader_Background); --_ui5wcr_ActionSheet_MobileHeaderBorderRadius: var(--sapPopover_BorderCornerRadius); --_ui5wcr_ObjectPage_SubSectionBackgroundColor: var(--sapGroup_ContentBackground); } [data-sap-theme="sap_horizon_dark"] { --_ui5wcr_Toolbar_FocusShadow: inset 0 0 0 0.125rem var(--sapContent_FocusColor); --_ui5wcr_Toolbar_FocusOutline: none; --_ui5wcr_ActionSheet_HeaderBoxShadow: var(--sapContent_HeaderShadow); --_ui5wcr_ObjectPage_SectionBorderTop: none; --_ui5wcr_Splitter_ContentBorderColor: var(--sapGroup_ContentBorderColor); --_ui5wcr_ObjectPage_PaddingBlockStart: 0.5rem; --_ui5wcr_ObjectPage_SectionTitleHeight: 2.75rem; --_ui5wcr-AnalyticalTable-HeaderFontFamily: var(--sapFontBoldFamily); --_ui5wcr-AnalyticalTable-OuterBorderBlock: none; --_ui5wcr-AnalyticalTable-OuterBorderInline: none; --_ui5wcr_ActionSheet_MobileHeaderBoxShadow: var(--sapContent_Shadow2); --_ui5wcr_ActionSheet_MobileHeaderTextColor: var(--sapPageHeader_TextColor); --_ui5wcr_ObjectPage_SectionTitleFontFamily: var(--sapFontBoldFamily); --_ui5wcr_ObjectPage_SectionTitleLineHeight: 4rem; --_ui5wcr_ObjectPage_SubSectionBorderRadius: var(--sapElement_BorderCornerRadius); --_ui5wcr_ActionSheet_MobileHeaderBackground: var(--sapPageHeader_Background); --_ui5wcr_ActionSheet_MobileHeaderBorderRadius: var(--sapPopover_BorderCornerRadius); --_ui5wcr_ObjectPage_SubSectionBackgroundColor: var(--sapGroup_ContentBackground); } [data-sap-theme="sap_horizon_hcb"] { --_ui5wcr_Splitter_BarOutline: 0.15rem dotted var(--sapGroup_ContentBorderColor); --_ui5wcr_Splitter_BarBorderFocus: solid var(--sapGroup_ContentBorderColor) 0.0625rem; --_ui5wcr_Splitter_BarBorderStyle: solid var(--sapGroup_ContentBorderColor) 0.0625rem; --_ui5wcr_ActionSheet_HeaderBoxShadow: var(--sapContent_HeaderShadow); --_ui5wcr_ObjectPage_SectionBorderTop: none; --_ui5wcr_Splitter_ContentBorderColor: var(--sapGroup_ContentBorderColor); --_ui5wcr-AnalyticalTable-HeaderFontFamily: var(--sapFontBoldFamily); --_ui5wcr-AnalyticalTable-HeaderBorderWidth: 0.188rem; --_ui5wcr-AnalyticalTable-OuterBorderInline: none; --_ui5wcr_ActionSheet_MobileHeaderBoxShadow: var(--sapContent_Shadow2); --_ui5wcr_ActionSheet_MobileHeaderTextColor: var(--sapPageHeader_TextColor); --_ui5wcr_ObjectPage_SectionTitleFontFamily: var(--sapFontBoldFamily); --_ui5wcr_ObjectPage_SubSectionBorderRadius: var(--sapElement_BorderCornerRadius); --_ui5wcr_Splitter_BarBorderHighContrastFix: none; --_ui5wcr_ActionSheet_MobileHeaderBackground: var(--sapPageHeader_Background); --_ui5wcr_ActionSheet_MobileHeaderBorderRadius: var(--sapPopover_BorderCornerRadius); --_ui5wcr_ObjectPage_SubSectionBackgroundColor: var(--sapGroup_ContentBackground); --_ui5wcr-AnalyticalTable-HeaderActiveTextColor: var(--sapContent_ContrastTextColor); --_ui5wcr_ObjectPage_SectionTitleTextDecoration: underline var(--sapList_SelectionBorderColor); } [data-sap-theme="sap_horizon_hcw"] { --_ui5wcr_Splitter_BarOutline: 0.15rem dotted var(--sapGroup_ContentBorderColor); --_ui5wcr_Splitter_BarBorderFocus: solid var(--sapGroup_ContentBorderColor) 0.0625rem; --_ui5wcr_Splitter_BarBorderStyle: solid var(--sapGroup_ContentBorderColor) 0.0625rem; --_ui5wcr_ActionSheet_HeaderBoxShadow: var(--sapContent_HeaderShadow); --_ui5wcr_ObjectPage_SectionBorderTop: none; --_ui5wcr_Splitter_ContentBorderColor: var(--sapGroup_ContentBorderColor); --_ui5wcr-AnalyticalTable-HeaderFontFamily: var(--sapFontBoldFamily); --_ui5wcr-AnalyticalTable-HeaderBorderWidth: 0.188rem; --_ui5wcr-AnalyticalTable-OuterBorderInline: none; --_ui5wcr_ActionSheet_MobileHeaderBoxShadow: var(--sapContent_Shadow2); --_ui5wcr_ActionSheet_MobileHeaderTextColor: var(--sapPageHeader_TextColor); --_ui5wcr_ObjectPage_SectionTitleFontFamily: var(--sapFontBoldFamily); --_ui5wcr_ObjectPage_SubSectionBorderRadius: var(--sapElement_BorderCornerRadius); --_ui5wcr_Splitter_BarBorderHighContrastFix: none; --_ui5wcr_ActionSheet_MobileHeaderBackground: var(--sapPageHeader_Background); --_ui5wcr_ActionSheet_MobileHeaderBorderRadius: var(--sapPopover_BorderCornerRadius); --_ui5wcr_ObjectPage_SubSectionBackgroundColor: var(--sapGroup_ContentBackground); --_ui5wcr-AnalyticalTable-HeaderActiveTextColor: var(--sapContent_ContrastTextColor); --_ui5wcr_ObjectPage_SectionTitleTextDecoration: underline var(--sapList_SelectionBorderColor); } * { --sapFontSize: .875rem; --sapBaseColor: #fff; --sapChart_Bad: #f53232; --sapLinkColor: #0064d9; --sapTextColor: #1d2d3e; --sapBrandColor: #0070f2; --sapChart_Good: #30914c; --sapErrorColor: #aa0808; --sapFontFamily: __font72BrandRegular_066071, __font72BrandRegular_Fallback_066071, Arial, Helvetica, sans-serif; --sapHoverColor: #0070F2; --sapShellColor: #fff; --sapTitleColor: #1d2d3e; --font-sap-icons: __fontSapIcons_472082, __fontSapIcons_Fallback_472082; --sapActiveColor: #dee2e5; --sapCompanyLogo: none; --sapAccentColor1: #d27700; --sapAccentColor2: #aa0808; --sapAccentColor3: #ba066c; --sapAccentColor4: #a100c2; --sapAccentColor5: #5d36ff; --sapAccentColor6: #0057d2; --sapAccentColor7: #046c7a; --sapAccentColor8: #256f3a; --sapAccentColor9: #6c32a9; --sapField_Shadow: inset 0 0 0 0.0625rem rgba(85,107,129,0.25); --sapLegendColor1: #c35500; --sapLegendColor2: #d23a0a; --sapLegendColor3: #df1278; --sapLegendColor4: #840606; --sapLegendColor5: #cc00dc; --sapLegendColor6: #0057d2; --sapLegendColor7: #07838f; --sapLegendColor8: #188918; --sapLegendColor9: #5b738b; --sapNeutralColor: #788fa6; --sapShell_Shadow: 0 0.125rem 0.125rem 0 rgba(34,53,72,0.15), inset 0 -0.0625rem 0 0 rgba(34,53,72,0.2); --sapSuccessColor: #256f3a; --sapWarningColor: #e76500; --sapAccentColor10: #5b738b; --sapChart_Neutral: #788fa6; --sapCriticalColor: #e76500; --sapFontLargeSize: 1rem; --sapFontSmallSize: .75rem; --sapLegendColor10: #7800a4; --sapLegendColor11: #a93e00; --sapLegendColor12: #aa2608; --sapLegendColor13: #ba066c; --sapLegendColor14: #8d2a00; --sapLegendColor15: #4e247a; --sapLegendColor16: #002a86; --sapLegendColor17: #035663; --sapLegendColor18: #1e592f; --sapLegendColor19: #1a4796; --sapLegendColor20: #470ced; --sapNegativeColor: #aa0808; --sapPositiveColor: #256f3a; --sapSelectedColor: #0064d9; --sapShell_Favicon: none; --sapChart_Critical: #e76500; --sapElement_Height: 2.25rem; --sapFontBoldFamily: __font72BrandBold_fbb837, __font72BrandBold_Fallback_fbb837, Arial, Helvetica, sans-serif; --sapFontBoldItalic: __font72BrandBoldItalic_c91dee, __font72BrandBoldItalic_Fallback_c91dee, Arial, Helvetica, sans-serif; --sapHighlightColor: #0064d9; --sapList_TextColor: #000000; --sapTile_IconColor: #556b82; --sapTile_TextColor: #556b82; --sapBackgroundColor: #f5f6f7; --sapBackgroundImage: none; --sapContent_Shadow0: 0 0 0.125rem 0 rgba(34,53,72,0.2), 0 0.125rem 0.25rem 0 rgba(34,53,72,0.2); --sapContent_Shadow1: 0 0 0 0.0625rem rgba(34,53,72,0.48), 0 0.125rem 0.5rem 0 rgba(34,53,72,0.3); --sapContent_Shadow2: 0 0 0 0.0625rem rgba(34,53,72,0.48), 0 0.625rem 1.875rem 0 rgba(34,53,72,0.25); --sapContent_Shadow3: 0 0 0 0.0625rem rgba(34,53,72,0.48), 0 1.25rem 5rem 0 rgba(34,53,72,0.25); --sapErrorBackground: #ffeaf4; --sapField_TextColor: #131e29; --sapFontBlackFamily: __font72BrandBlack_6dfbe2, __font72BrandBlack_Fallback_6dfbe2, Arial, Helvetica, sans-serif; --sapFontHeader1Size: 3rem; --sapFontHeader2Size: 2rem; --sapFontHeader3Size: 1.5rem; --sapFontHeader4Size: 1.25rem; --sapFontHeader5Size: 1rem; --sapFontHeader6Size: .875rem; --sapFontLightFamily: __font72BrandLight_2172bc, __font72BrandLight_Fallback_2172bc, Arial, Helvetica, sans-serif; --sapList_Background: #fff; --sapShell_TextColor: #1d2d3e; --sapTile_Background: #fff; --sapButton_IconColor: #0064d9; --sapButton_TextColor: #0064d9; --sapChart_Sequence_1: #0070f2; --sapChart_Sequence_2: #c87b00; --sapChart_Sequence_3: #75980b; --sapChart_Sequence_4: #df1278; --sapChart_Sequence_5: #8b47d7; --sapChart_Sequence_6: #049f9a; --sapChart_Sequence_7: #3c8cdd; --sapChart_Sequence_8: #cc00dc; --sapChart_Sequence_9: #798c77; --sapErrorBorderColor: #e90b0b; --sapField_Background: #fff; --sapFontHeaderFamily: var(--sapFontBoldFamily); --sapInformationColor: #0070f2; --sapInformativeColor: #0070f2; --sapLink_Hover_Color: #0040B0; --sapLink_SubtleColor: #1d2d3e; --sapList_BorderColor: #e5e5e5; --sapList_BorderWidth: .0625rem; --sapNeutralTextColor: #1d2d3e; --sapShell_Background: #eff1f2; --sapTile_BorderColor: #EAECEE; --sapButton_Background: #fff; --sapChart_Sequence_10: #da6c6c; --sapChart_Sequence_11: #5d36ff; --sapContent_BusyColor: #0064d9; --sapContent_HelpColor: #188918; --sapContent_IconColor: #1d2d3e; --sapCriticalTextColor: #b44f00; --sapField_BorderColor: #5B738B; --sapField_BorderStyle: none; --sapField_BorderWidth: .0625rem; --sapGroup_BorderWidth: .0625rem; --sapIndicationColor_1: #840606; --sapIndicationColor_2: #aa0808; --sapIndicationColor_3: #b95100; --sapIndicationColor_4: #256f3a; --sapIndicationColor_5: #0070f2; --sapIndicationColor_6: #046c7a; --sapIndicationColor_7: #5d36ff; --sapIndicationColor_8: #a100c2; --sapIndicationColor_9: #1d2d3e; --sapInfobar_TextColor: #046c7a; --sapLink_Active_Color: #0064d9; --sapNegativeTextColor: #aa0808; --sapNeutralBackground: #eff1f2; --sapPositiveTextColor: #256f3a; --sapProgress_FontSize: .875rem; --sapShell_BorderColor: #D5DADD; --sapSlider_Background: #d5dadd; --sapSuccessBackground: #f5fae5; --sapWarningBackground: #fff8d6; --sapAvatar_1_TextColor: #a45d00; --sapAvatar_2_TextColor: #aa0808; --sapAvatar_3_TextColor: #ba066c; --sapAvatar_4_TextColor: #a100c2; --sapAvatar_5_TextColor: #552cff; --sapAvatar_6_TextColor: #0057d2; --sapAvatar_7_TextColor: #046c7a; --sapAvatar_8_TextColor: #256f3a; --sapAvatar_9_TextColor: #6c32a9; --sapButton_BorderColor: #bcc3ca; --sapButton_BorderWidth: .0625rem; --sapContent_FocusColor: #0032a5; --sapContent_FocusStyle: solid; --sapContent_FocusWidth: .125rem; --sapContent_IconHeight: 1rem; --sapContent_LabelColor: #556b82; --sapContent_LineHeight: 1.5; --sapContent_RatedColor: #d27700; --sapContent_TextShadow: 0 0 0.125rem #fff; --sapElement_LineHeight: 2.75rem; --sapField_Hover_Shadow: inset 0 0 0 0.0625rem rgba(79,160,255,0.5); --sapField_InvalidColor: #e90b0b; --sapField_SuccessColor: #30914c; --sapField_WarningColor: #dd6100; --sapFontSemiboldFamily: __font72BrandSemiBold_155fdc, __font72BrandSemiBold_Fallback_155fdc, Arial, Helvetica, sans-serif; --sapHighlightTextColor: #fff; --sapIndicationColor_10: #45484a; --sapIndicationColor_1b: #fb9d9d; --sapIndicationColor_2b: #fcc4c4; --sapIndicationColor_3b: #fff2c0; --sapIndicationColor_4b: #bae8bc; --sapIndicationColor_5b: #d3effd; --sapIndicationColor_6b: #cdf5ec; --sapIndicationColor_7b: #e2dbff; --sapIndicationColor_8b: #f8d6ff; --sapIndicationColor_9b: #fff; --sapInfobar_Background: #c2fcee; --sapLink_InvertedColor: #a6cfff; --sapLink_Visited_Color: #0064d9; --sapNeutralBorderColor: #788fa6; --sapProgress_TextColor: #1d2d3e; --sapShell_NeutralColor: #1d2d3e; --sapSlider_BorderColor: #d5dadd; --sapSuccessBorderColor: #30914c; --sapToolbar_Background: #fff; --sapWarningBorderColor: #dd6100; --sapAvatar_10_TextColor: #556b82; --sapAvatar_1_Background: #fff3b8; --sapAvatar_2_Background: #ffd0e7; --sapAvatar_3_Background: #ffdbe7; --sapAvatar_4_Background: #ffdcf3; --sapAvatar_5_Background: #ded3ff; --sapAvatar_6_Background: #d1efff; --sapAvatar_7_Background: #c2fcee; --sapAvatar_8_Background: #ebf5cb; --sapAvatar_9_Background: #ddccf0; --sapContent_ShadowColor: #223548; --sapElement_BorderWidth: .0625rem; --sapField_InvalidShadow: inset 0 0 0 0.0625rem rgba(255,142,196,0.45); --sapField_RequiredColor: #ba066c; --sapField_SuccessShadow: inset 0 0 0 0.0625rem rgba(48,145,76,0.18); --sapField_WarningShadow: inset 0 0 0 0.0625rem rgba(255,213,10,0.4); --sapIndicationColor_10b: #eaecee; --sapLink_TextDecoration: none; --sapNeutralElementColor: #788fa6; --sapProgress_Background: #d5dadd; --sapScrollBar_Dimension: .75rem; --sapScrollBar_FaceColor: #7b91a8; --sapShell_CriticalColor: #b44f00; --sapShell_NegativeColor: #aa0808; --sapShell_PositiveColor: #256f3a; --sapTile_SeparatorColor: #ccc; --sapTile_TitleTextColor: #1d2d3e; --sapAvatar_10_Background: #eaecee; --sapAvatar_1_BorderColor: #fff3b8; --sapAvatar_2_BorderColor: #ffd0e7; --sapAvatar_3_BorderColor: #ffdbe7; --sapAvatar_4_BorderColor: #ffdcf3; --sapAvatar_5_BorderColor: #ded3ff; --sapAvatar_6_BorderColor: #d1efff; --sapAvatar_7_BorderColor: #c2fcee; --sapAvatar_8_BorderColor: #ebf5cb; --sapAvatar_9_BorderColor: #ddccf0; --sapChart_OrderedColor_1: #0070f2; --sapChart_OrderedColor_2: #c87b00; --sapChart_OrderedColor_3: #75980b; --sapChart_OrderedColor_4: #df1278; --sapChart_OrderedColor_5: #8b47d7; --sapChart_OrderedColor_6: #049f9a; --sapChart_OrderedColor_7: #3c8cdd; --sapChart_OrderedColor_8: #cc00dc; --sapChart_OrderedColor_9: #798c77; --sapContent_HeaderShadow: 0 0.125rem 0.125rem 0 rgba(34,53,72,0.05), inset 0 -0.0625rem 0 0 #d9d9d9; --sapContent_UnratedColor: #758ca4; --sapCriticalElementColor: #e76500; --sapField_HelpBackground: #fff; --sapGroup_TitleTextColor: #1d2d3e; --sapGroup_Title_FontSize: 1rem; --sapInformativeTextColor: #0064d9; --sapList_FooterTextColor: #1d2d3e; --sapList_HeaderTextColor: #1d2d3e; --sapNegativeElementColor: #f53232; --sapPageFooter_TextColor: #1d2d3e; --sapPageHeader_TextColor: #1d2d3e; --sapPositiveElementColor: #30914c; --sapProgress_BorderColor: #d5dadd; --sapScrollBar_TrackColor: #fff; --sapAvatar_10_BorderColor: #eaecee; --sapBackgroundImageRepeat: false; --sapBlockLayer_Background: #000; --sapButton_Lite_TextColor: #0064d9; --sapChart_OrderedColor_10: #da6c6c; --sapChart_OrderedColor_11: #5d36ff; --sapField_BackgroundStyle: 0 100% / 100% .0625rem no-repeat linear-gradient(0deg, #556b81, #556b81) border-box; --sapGroup_TitleBackground: #fff; --sapInformationBackground: #e1f4ff; --sapList_Active_TextColor: #1d2d3e; --sapList_FooterBackground: #fff; --sapList_HeaderBackground: #fff; --sapList_Hover_Background: #eaecee; --sapPageFooter_Background: #fff; --sapPageHeader_Background: #fff; --sapScrollBar_BorderColor: #7b91a8; --sapScrollBar_SymbolColor: #0064d9; --sapShell_BackgroundImage: linear-gradient(to bottom, #eff1f2, #eff1f2); --sapTile_Hover_Background: #eaecee; --sapAccentBackgroundColor1: #fff3b8; --sapAccentBackgroundColor2: #ffd0e7; --sapAccentBackgroundColor3: #ffdbe7; --sapAccentBackgroundColor4: #ffdcf3; --sapAccentBackgroundColor5: #ded3ff; --sapAccentBackgroundColor6: #d1efff; --sapAccentBackgroundColor7: #c2fcee; --sapAccentBackgroundColor8: #ebf5cb; --sapAccentBackgroundColor9: #ddccf0; --sapBackgroundImageOpacity: 1.0; --sapButton_Hover_TextColor: #0064d9; --sapButton_Lite_Background: transparent; --sapButton_TokenBackground: #fff; --sapButton_Track_TextColor: #fff; --sapChart_Sequence_Neutral: #788fa6; --sapContent_BadgeTextColor: #fff; --sapContent_IconFontFamily: var(--font-sap-icons); --sapContent_Neutral_Shadow: inset 0 0 0 0.0625rem rgba(120,143,166,0.3); --sapElement_Compact_Height: 1.625rem; --sapField_Focus_Background: #fff; --sapField_Hover_Background: #fff; --sapField_InformationColor: #0070f2; --sapGroup_FooterBackground: transparent; --sapGroup_TitleBorderColor: #a8b2bd; --sapInformationBorderColor: #0070f2; --sapLegendBackgroundColor1: #ffef9f; --sapLegendBackgroundColor2: #feeae1; --sapLegendBackgroundColor3: #fbf6f8; --sapLegendBackgroundColor4: #fbebeb; --sapLegendBackgroundColor5: #ffe5fe; --sapLegendBackgroundColor6: #d1efff; --sapLegendBackgroundColor7: #c2fcee; --sapLegendBackgroundColor8: #f5fae5; --sapLegendBackgroundColor9: #f5f6f7; --sapLegend_CurrentDateTime: #a100c2; --sapList_Active_Background: #dee2e5; --sapList_HeaderBorderColor: #a8b2bd; --sapList_TableFooterBorder: #a8b2bd; --sapPageFooter_BorderColor: #d9d9d9; --sapPageHeader_BorderColor: #d9d9d9; --sapShell_Active_TextColor: #0040B0; --sapShell_Hover_Background: #fff; --sapShell_InformativeColor: #0064d9; --sapTile_Active_Background: #dee2e5; --sapTile_OverlayBackground: #fff; --sapToolbar_SeparatorColor: #d9d9d9; --sapAccentBackgroundColor10: #eaecee; --sapButton_Accept_TextColor: #256f3a; --sapButton_Active_TextColor: #0064d9; --sapButton_Handle_TextColor: #1d2d3e; --sapButton_Hover_Background: #eaecee; --sapButton_Lite_BorderColor: transparent; --sapButton_Reject_TextColor: #aa0808; --sapButton_TokenBorderColor: #bcc3ca; --sapButton_Track_Background: #788fa6; --sapContent_BadgeBackground: #aa0808; --sapContent_Critical_Shadow: inset 0 0 0 0.0625rem rgba(255,213,10,0.4); --sapContent_DisabledOpacity: 0.4; --sapContent_ForegroundColor: #efefef; --sapContent_MarkerIconColor: #5d36ff; --sapContent_MarkerTextColor: #046c7a; --sapContent_Negative_Shadow: inset 0 0 0 0.0625rem rgba(255,142,196,0.45); --sapContent_Positive_Shadow: inset 0 0 0 0.0625rem rgba(48,145,76,0.18); --sapContent_Selected_Shadow: inset 0 0 0 0.0625rem rgba(79,160,255,0.5); --sapField_Focus_BorderColor: #0032a5; --sapField_Hover_BorderColor: #0064d9; --sapField_InformationShadow: inset 0 0 0 0.0625rem rgba(104,174,255,0.5); --sapField_InvalidBackground: #ffeaf4; --sapField_SuccessBackground: #f5fae5; --sapField_WarningBackground: #fff8d6; --sapGroup_ContentBackground: #fff; --sapInformativeElementColor: #0070f2; --sapLegendBackgroundColor10: #fff0fa; --sapLegendBackgroundColor11: #fff8d6; --sapLegendBackgroundColor12: #fff6f6; --sapLegendBackgroundColor13: #f7ebef; --sapLegendBackgroundColor14: #f1ecd5; --sapLegendBackgroundColor15: #f0e7f8; --sapLegendBackgroundColor16: #ebf8ff; --sapLegendBackgroundColor17: #dafdf5; --sapLegendBackgroundColor18: #ebf5cb; --sapLegendBackgroundColor19: #fafdff; --sapLegendBackgroundColor20: #eceeff; --sapObjectHeader_Background: #fff; --sapShell_Active_Background: #fff; --sapSlider_HandleBackground: #fff; --sapTile_BorderCornerRadius: 1rem; --sapButton_Accept_Background: #ebf5cb; --sapButton_Active_Background: #fff; --sapButton_Handle_Background: #fff; --sapButton_Hover_BorderColor: #bcc3ca; --sapButton_Neutral_TextColor: #0064d9; --sapButton_Reject_Background: #ffd6e9; --sapButton_Success_TextColor: #fff; --sapButton_Track_BorderColor: #788fa6; --sapElement_Condensed_Height: 1.375rem; --sapField_Active_BorderColor: #0064d9; --sapField_BorderCornerRadius: .25rem; --sapField_InvalidBorderStyle: none; --sapField_InvalidBorderWidth: .125rem; --sapField_SuccessBorderStyle: none; --sapField_SuccessBorderWidth: .0625rem; --sapField_WarningBorderStyle: none; --sapField_WarningBorderWidth: .125rem; --sapFontSemiboldDuplexFamily: __font72BrandSemiBoldDuplex_d239bd, __font72BrandSemiBoldDuplex_Fallback_d239bd, Arial, Helvetica, sans-serif; --sapGroup_BorderCornerRadius: .5rem; --sapGroup_ContentBorderColor: #d9d9d9; --sapInfobar_Hover_Background: #fff; --sapLegend_WorkingBackground: #fff; --sapMessage_ErrorBorderColor: #ff8ec4; --sapObjectHeader_BorderColor: #d9d9d9; --sapProgress_Value_TextColor: #788fa6; --sapShell_Selected_TextColor: #0070f2; --sapSlider_HandleBorderColor: #b0d5ff; --sapButton_Accept_BorderColor: #dbeda0; --sapButton_Active_BorderColor: #0064d9; --sapButton_BorderCornerRadius: .5rem; --sapButton_Critical_TextColor: #fff; --sapButton_Handle_BorderColor: #fff; --sapButton_Negative_TextColor: #fff; --sapButton_Neutral_Background: #e8f3ff; --sapButton_Reject_BorderColor: #ffc2de; --sapButton_Selected_TextColor: #0064d9; --sapButton_Success_Background: #30914c; --sapContent_ContrastIconColor: #fff; --sapContent_ContrastTextColor: #fff; --sapContent_DisabledTextColor: rgba(29,45,62,0.6); --sapContent_ForcedColorAdjust: none; --sapField_Hover_InvalidShadow: inset 0 0 0 0.0625rem rgba(255,142,196,0.45); --sapField_Hover_SuccessShadow: inset 0 0 0 0.0625rem rgba(48,145,76,0.18); --sapField_Hover_WarningShadow: inset 0 0 0 0.0625rem rgba(255,213,10,0.4); --sapField_ReadOnly_Background: #eaecee; --sapInfobar_Active_Background: #fff; --sapLink_Hover_TextDecoration: underline; --sapList_GroupHeaderTextColor: #1d2d3e; --sapList_SelectionBorderColor: #0064d9; --sapProgress_Value_Background: #788fa6; --sapScrollBar_Hover_FaceColor: #5b728b; --sapShell_GroupTitleTextColor: #1d2d3e; --sapShell_Selected_Background: #fff; --sapButton_Attention_TextColor: #b44f00; --sapButton_Critical_Background: #e76500; --sapButton_Negative_Background: #f53232; --sapButton_Neutral_BorderColor: #b5d8ff; --sapButton_Selected_Background: #fff; --sapButton_Success_BorderColor: #30914c; --sapContent_ContrastFocusColor: #fff; --sapContent_ContrastTextShadow: 0 0 0.0625rem rgba(0,0,0,0.7); --sapContent_Informative_Shadow: inset 0 0 0 0.0625rem rgba(104,174,255,0.5); --sapContent_Interaction_Shadow: inset 0 0 0 0.0625rem rgba(85,107,129,0.25); --sapContent_Selected_TextColor: #0064d9; --sapElement_BorderCornerRadius: .75rem; --sapElement_Compact_LineHeight: 2rem; --sapField_Focus_HelpBackground: #fff; --sapField_Hover_HelpBackground: #fff; --sapField_PlaceholderTextColor: #475E75; --sapField_ReadOnly_BorderColor: #556b81; --sapField_ReadOnly_BorderStyle: none; --sapLink_Active_TextDecoration: none; --sapList_AlternatingBackground: #f5f6f7; --sapList_GroupHeaderBackground: #fff; --sapList_TableFixedBorderColor: #8c8c8c; --sapMessage_SuccessBorderColor: #cee67e; --sapMessage_WarningBorderColor: #ffe770; --sapPopover_BorderCornerRadius: .5rem; --sapProgress_CriticalTextColor: #1d2d3e; --sapProgress_NegativeTextColor: #1d2d3e; --sapProgress_PositiveTextColor: #1d2d3e; --sapProgress_Value_BorderColor: #788fa6; --sapShell_Category_1_TextColor: #fff; --sapShell_Category_2_TextColor: #fff; --sapShell_Category_3_TextColor: #fff; --sapShell_Category_4_TextColor: #fff; --sapShell_Category_5_TextColor: #fff; --sapShell_Category_6_TextColor: #fff; --sapShell_Category_7_TextColor: #fff; --sapShell_Category_8_TextColor: #fff; --sapShell_Category_9_TextColor: #fff; --sapShell_GroupTitleTextShadow: 0 0 0.125rem #fff; --sapShell_InteractiveTextColor: #354A5F; --sapShell_Navigation_TextColor: #1d2d3e; --sapSlider_Selected_Background: #0064d9; --sapButton_Attention_Background: #fff3b7; --sapButton_Critical_BorderColor: #e76500; --sapButton_Emphasized_TextColor: #fff; --sapButton_Lite_Hover_TextColor: #0064d9; --sapButton_Negative_BorderColor: #f53232; --sapButton_Selected_BorderColor: #0064d9; --sapContent_ContrastShadowColor: #fff; --sapContent_ForegroundTextColor: #1d2d3e; --sapContent_Illustrative_Color1: #5d36ff; --sapContent_Illustrative_Color2: #0070f2; --sapContent_Illustrative_Color3: #f58b00; --sapContent_Illustrative_Color4: #00144a; --sapContent_Illustrative_Color5: #a9b4be; --sapContent_Illustrative_Color6: #d5dadd; --sapContent_Illustrative_Color7: #ebf8ff; --sapContent_Illustrative_Color8: #fff; --sapContent_Illustrative_Color9: #64edd2; --sapContent_Selected_Background: #fff; --sapField_Hover_BackgroundStyle: 0 100% / 100% .0625rem no-repeat linear-gradient(0deg, #0064d9, #0064d9) border-box; --sapField_InformationBackground: #e1f4ff; --sapIndicationColor_1_TextColor: #fff; --sapIndicationColor_2_TextColor: #fff; --sapIndicationColor_3_TextColor: #fff; --sapIndicationColor_4_TextColor: #fff; --sapIndicationColor_5_TextColor: #fff; --sapIndicationColor_6_TextColor: #fff; --sapIndicationColor_7_TextColor: #fff; --sapIndicationColor_8_TextColor: #fff; --sapIndicationColor_9_TextColor: #fff; --sapLegend_NonWorkingBackground: #ebebeb; --sapList_GroupHeaderBorderColor: #a8b2bd; --sapObjectHeader_Title_FontSize: 1.5rem; --sapProgress_CriticalBackground: #fff4bd; --sapProgress_NegativeBackground: #ffdbec; --sapProgress_PositiveBackground: #e5f2ba; --sapShell_BackgroundImageRepeat: false; --sapShell_Category_10_TextColor: #fff; --sapShell_Category_11_TextColor: #fff; --sapShell_Category_12_TextColor: #fff; --sapShell_Category_13_TextColor: #fff; --sapShell_Category_14_TextColor: #fff; --sapShell_Category_15_TextColor: #fff; --sapShell_Category_16_TextColor: #fff; --sapShell_Category_1_Background: #0057d2; --sapShell_Category_1_TextShadow: 0 0 .0625rem rgba(0,0,0,0.7); --sapShell_Category_2_Background: #df1278; --sapShell_Category_2_TextShadow: 0 0 .0625rem rgba(0,0,0,0.7); --sapShell_Category_3_Background: #e76500; --sapShell_Category_3_TextShadow: 0 0 .0625rem rgba(0,0,0,0.7); --sapShell_Category_4_Background: #7800a4; --sapShell_Category_4_TextShadow: 0 0 .0625rem rgba(0,0,0,0.7); --sapShell_Category_5_Background: #aa2608; --sapShell_Category_5_TextShadow: 0 0 .0625rem rgba(0,0,0,0.7); --sapShell_Category_6_Background: #07838f; --sapShell_Category_6_TextShadow: 0 0 .0625rem rgba(0,0,0,0.7); --sapShell_Category_7_Background: #f31ded; --sapShell_Category_7_TextShadow: 0 0 .0625rem rgba(0,0,0,0.7); --sapShell_Category_8_Background: #188918; --sapShell_Category_8_TextShadow: 0 0 .0625rem rgba(0,0,0,0.7); --sapShell_Category_9_Background: #002a86; --sapShell_Category_9_TextShadow: 0 0 .0625rem rgba(0,0,0,0.7); --sapShell_InteractiveBackground: #F5F6F7; --sapShell_Navigation_Background: #FFFFFF; --sapSlider_Selected_BorderColor: #0064d9; --sapTile_OverlayForegroundColor: #1d2d3e; --sapButton_Attention_BorderColor: #ffeb84; --sapButton_Emphasized_Background: #0070f2; --sapButton_Emphasized_FontWeight: bold; --sapButton_Emphasized_TextShadow: transparent; --sapButton_Information_TextColor: #0064d9; --sapButton_Lite_Hover_Background: #eaecee; --sapContent_Illustrative_Color10: #ebf8ff; --sapContent_Illustrative_Color11: #f31ded; --sapContent_Illustrative_Color12: #00a800; --sapContent_Illustrative_Color13: #005dc9; --sapContent_Illustrative_Color14: #004da5; --sapContent_Illustrative_Color15: #cc7400; --sapContent_Illustrative_Color16: #3b0ac6; --sapContent_Illustrative_Color17: #00a58a; --sapContent_Illustrative_Color18: #d1efff; --sapContent_Illustrative_Color19: #b8e6ff; --sapContent_Illustrative_Color20: #9eddff; --sapContent_SearchHighlightColor: #dafdf5; --sapElement_Condensed_LineHeight: 1.5rem; --sapField_InformationBorderStyle: none; --sapField_InformationBorderWidth: .125rem; --sapField_InvalidBackgroundStyle: 0 100% / 100% .125rem no-repeat linear-gradient(0deg, #e90b0b, #e90b0b) border-box; --sapField_SuccessBackgroundStyle: 0 100% / 100% .0625rem no-repeat linear-gradient(0deg, #30914c, #30914c) border-box; --sapField_WarningBackgroundStyle: 0 100% / 100% .125rem no-repeat linear-gradient(0deg, #dd6100, #dd6100) border-box; --sapIndicationColor_10_TextColor: #fff; --sapIndicationColor_1_Background: #840606; --sapIndicationColor_2_Background: #aa0808; --sapIndicationColor_3_Background: #e76500; --sapIndicationColor_4_Background: #256f3a; --sapIndicationColor_5_Background: #0070f2; --sapIndicationColor_6_Background: #046c7a; --sapIndicationColor_7_Background: #5d36ff; --sapIndicationColor_8_Background: #a100c2; --sapIndicationColor_9_Background: #1d2d3e; --sapObjectHeader_Title_TextColor: #1d2d3e; --sapProgress_CriticalBorderColor: #fff4bd; --sapProgress_NegativeBorderColor: #ffdbec; --sapProgress_PositiveBorderColor: #e5f2ba; --sapShell_BackgroundImageOpacity: 1.0; --sapShell_Category_10_Background: #5b738b; --sapShell_Category_10_TextShadow: 0 0 .0625rem rgba(0,0,0,0.7); --sapShell_Category_11_Background: #d20a0a; --sapShell_Category_11_TextShadow: 0 0 .0625rem rgba(0,0,0,0.7); --sapShell_Category_12_Background: #7858ff; --sapShell_Category_12_TextShadow: 0 0 .0625rem rgba(0,0,0,0.7); --sapShell_Category_13_Background: #a00875; --sapShell_Category_13_TextShadow: 0 0 .0625rem rgba(0,0,0,0.7); --sapShell_Category_14_Background: #14565b; --sapShell_Category_14_TextShadow: 0 0 .0625rem rgba(0,0,0,0.7); --sapShell_Category_15_Background: #223548; --sapShell_Category_15_TextShadow: 0 0 .0625rem rgba(0,0,0,0.7); --sapShell_Category_16_Background: #1e592f; --sapShell_Category_16_TextShadow: 0 0 .0625rem rgba(0,0,0,0.7); --sapShell_Category_1_BorderColor: #0057d2; --sapShell_Category_2_BorderColor: #df1278; --sapShell_Category_3_BorderColor: #e76500; --sapShell_Category_4_BorderColor: #7800a4; --sapShell_Category_5_BorderColor: #aa2608; --sapShell_Category_6_BorderColor: #07838f; --sapShell_Category_7_BorderColor: #f31ded; --sapShell_Category_8_BorderColor: #188918; --sapShell_Category_9_BorderColor: #002a86; --sapShell_InteractiveBorderColor: #556b81; --sapSlider_RangeHandleBackground: #fff; --sapTile_Interactive_BorderColor: #b3b3b3; --sapButton_Accept_Hover_TextColor: #256f3a; --sapButton_Emphasized_BorderColor: #0070f2; --sapButton_Information_Background: #e8f3ff; --sapButton_Lite_Active_Background: #fff; --sapButton_Lite_Hover_BorderColor: #bcc3ca; --sapButton_Reject_Hover_TextColor: #aa0808; --sapButton_Track_Hover_Background: #637d97; --sapContent_ContrastTextThreshold: 0.65; --sapContent_ForegroundBorderColor: #758ca4; --sapContent_MeasureIndicatorColor: #556b81; --sapField_Hover_InformationShadow: inset 0 0 0 0.0625rem rgba(104,174,255,0.5); --sapField_ReadOnly_HelpBackground: #eaecee; --sapIndicationColor_10_Background: #83888b; --sapIndicationColor_1_BorderColor: #840606; --sapIndicationColor_2_BorderColor: #aa0808; --sapIndicationColor_3_BorderColor: #e76500; --sapIndicationColor_4_BorderColor: #256f3a; --sapIndicationColor_5_BorderColor: #0070f2; --sapIndicationColor_6_BorderColor: #046c7a; --sapIndicationColor_7_BorderColor: #5d36ff; --sapIndicationColor_8_BorderColor: #a100c2; --sapIndicationColor_9_BorderColor: #1d2d3e; --sapList_SelectionBackgroundColor: #ebf8ff; --sapObjectHeader_Hover_Background: #eaecee; --sapProgress_InformationTextColor: #1d2d3e; --sapShell_Category_10_BorderColor: #5b738b; --sapShell_Category_11_BorderColor: #d20a0a; --sapShell_Category_12_BorderColor: #7858ff; --sapShell_Category_13_BorderColor: #a00875; --sapShell_Category_14_BorderColor: #14565b; --sapShell_Category_15_BorderColor: #223548; --sapShell_Category_16_BorderColor: #1e592f; --sapSlider_Hover_HandleBackground: #e3f0ff; --sapButton_Accept_Active_TextColor: #256f3a; --sapButton_Accept_Hover_Background: #e3f1b6; --sapButton_Handle_Hover_Background: #fff; --sapButton_Information_BorderColor: #b5d8ff; --sapButton_Lite_Active_BorderColor: #0064d9; --sapButton_Neutral_Hover_TextColor: #0064d9; --sapButton_Reject_Active_TextColor: #aa0808; --sapButton_Reject_Hover_Background: #ffbddb; --sapButton_Success_Hover_TextColor: #fff; --sapButton_Track_Hover_BorderColor: #637d97; --sapContent_DragAndDropActiveColor: #0064d9; --sapField_ReadOnly_BackgroundStyle: 0 100% / 0.375rem .0625rem repeat-x linear-gradient(90deg, #556b81 0, #556b81 0.25rem, transparent 0.25rem) border-box; --sapIndicationColor_10_BorderColor: #83888b; --sapIndicationColor_1b_BorderColor: #fb9d9d; --sapIndicationColor_2b_BorderColor: #fcc4c4; --sapIndicationColor_3b_BorderColor: #fff2c0; --sapIndicationColor_4b_BorderColor: #bae8bc; --sapIndicationColor_5b_BorderColor: #d3effd; --sapIndicationColor_6b_BorderColor: #cdf5ec; --sapIndicationColor_7b_BorderColor: #e2dbff; --sapIndicationColor_8b_BorderColor: #f8d6ff; --sapIndicationColor_9b_BorderColor: #d9d9d9; --sapList_Hover_SelectionBackground: #dcf3ff; --sapList_TableGroupHeaderTextColor: #1d2d3e; --sapMessage_InformationBorderColor: #7bcfff; --sapProgress_InformationBackground: #cdedff; --sapShell_Navigation_SelectedColor: #0064d9; --sapSlider_Active_HandleBackground: #fff; --sapSlider_Hover_HandleBorderColor: #b0d5ff; --sapButton_Accept_Active_Background: #fff; --sapButton_Accept_Hover_BorderColor: #e3f1b6; --sapButton_Critical_Hover_TextColor: #fff; --sapButton_Handle_Hover_BorderColor: rgba(255,255,255,0.5); --sapButton_Negative_Hover_TextColor: #fff; --sapButton_Neutral_Active_TextColor: #0064d9; --sapButton_Neutral_Hover_Background: #d4e8ff; --sapButton_Reject_Active_Background: #fff; --sapButton_Reject_Hover_BorderColor: #ffbddb; --sapButton_Success_Active_TextColor: #256f3a; --sapButton_Success_Hover_Background: #2c8646; --sapButton_Track_Negative_TextColor: #fff; --sapButton_Track_Positive_TextColor: #fff; --sapButton_Track_Selected_TextColor: #fff; --sapContent_NonInteractiveIconColor: #758ca4; --sapIndicationColor_10b_BorderColor: #eaecee; --sapList_TableGroupHeaderBackground: #eff1f2; --sapObjectHeader_Subtitle_TextColor: #556b82; --sapProgress_InformationBorderColor: #cdedff; --sapShell_Selected_Hover_Background: #fff; --sapSlider_Active_HandleBorderColor: #0064d9; --sapButton_Accept_Active_BorderColor: #30914c; --sapButton_Accept_Selected_TextColor: #256f3a; --sapButton_Attention_Hover_TextColor: #b44f00; --sapButton_Critical_Active_TextColor: #b44f00; --sapButton_Critical_Hover_Background: #dd6100; --sapButton_Handle_Negative_TextColor: #aa0808; --sapButton_Handle_Positive_TextColor: #256f3a; --sapButton_Handle_Selected_TextColor: #0064d9; --sapButton_Negative_Active_TextColor: #aa0808; --sapButton_Negative_Hover_Background: #e90b0b; --sapButton_Neutral_Active_Background: #fff; --sapButton_Neutral_Hover_BorderColor: #b5d8ff; --sapButton_Reject_Active_BorderColor: #e90b0b; --sapButton_Reject_Selected_TextColor: #aa0808; --sapButton_Selected_Hover_Background: #e3f0ff; --sapButton_Success_Active_Background: #fff; --sapButton_Success_Hover_BorderColor: #2c8646; --sapButton_Track_Negative_Background: #f53232; --sapButton_Track_Positive_Background: #30914c; --sapButton_Track_Selected_Background: #0064d9; --sapContent_Selected_ForegroundColor: #0064d9; --sapField_InformationBackgroundStyle: 0 100% / 100% .125rem no-repeat linear-gradient(0deg, #0070f2, #0070f2) border-box; --sapList_TableGroupHeaderBorderColor: #a8b2bd; --sapProgress_Value_CriticalTextColor: #e76500; --sapProgress_Value_NegativeTextColor: #f53232; --sapProgress_Value_PositiveTextColor: #30914c; --sapButton_Accept_Selected_Background: #fff; --sapButton_Attention_Active_TextColor: #b44f00; --sapButton_Attention_Hover_Background: #ffef9e; --sapButton_Critical_Active_Background: #fff; --sapButton_Critical_Hover_BorderColor: #dd6100; --sapButton_Emphasized_Hover_TextColor: #fff; --sapButton_Handle_Negative_Background: #fff; --sapButton_Handle_Positive_Background: #fff; --sapButton_Handle_Selected_Background: #fff; --sapButton_Negative_Active_Background: #fff; --sapButton_Negative_Hover_BorderColor: #e90b0b; --sapButton_Neutral_Active_BorderColor: #0064d9; --sapButton_Reject_Selected_Background: #fff; --sapButton_Selected_Hover_BorderColor: #0064d9; --sapButton_Success_Active_BorderColor: #30914c; --sapButton_Track_Negative_BorderColor: #f53232; --sapButton_Track_Positive_BorderColor: #30914c; --sapButton_Track_Selected_BorderColor: #0064d9; --sapContent_Selected_Hover_Background: #e3f0ff; --sapInfobar_NonInteractive_Background: #f5f6f7; --sapProgress_Value_CriticalBackground: #e76500; --sapProgress_Value_NegativeBackground: #f53232; --sapProgress_Value_PositiveBackground: #30914c; --sapShell_Navigation_Active_TextColor: #0064d9; --sapShell_Navigation_Hover_Background: #fff; --sapButton_Accept_Selected_BorderColor: #30914c; --sapButton_Attention_Active_Background: #fff; --sapButton_Attention_Hover_BorderColor: #ffef9e; --sapButton_Critical_Active_BorderColor: #dd6100; --sapButton_Emphasized_Active_TextColor: #0064d9; --sapButton_Emphasized_Hover_Background: #0064d9; --sapButton_Handle_Negative_BorderColor: #fff; --sapButton_Handle_Positive_BorderColor: #fff; --sapButton_Handle_Selected_BorderColor: #fff; --sapButton_Information_Hover_TextColor: #0064d9; --sapButton_Negative_Active_BorderColor: #f53232; --sapButton_Reject_Selected_BorderColor: #e90b0b; --sapContent_ImagePlaceholderBackground: #eaecee; --sapIndicationColor_1_Active_TextColor: #840606; --sapIndicationColor_1_Hover_Background: #6c0505; --sapIndicationColor_2_Active_TextColor: #aa0808; --sapIndicationColor_2_Hover_Background: #920707; --sapIndicationColor_3_Active_TextColor: #b95100; --sapIndicationColor_3_Hover_Background: #d85e00; --sapIndicationColor_4_Active_TextColor: #256f3a; --sapIndicationColor_4_Hover_Background: #1f5c30; --sapIndicationColor_5_Active_TextColor: #0070f2; --sapIndicationColor_5_Hover_Background: #0064d9; --sapIndicationColor_6_Active_TextColor: #046c7a; --sapIndicationColor_6_Hover_Background: #035661; --sapIndicationColor_7_Active_TextColor: #5d36ff; --sapIndicationColor_7_Hover_Background: #481cff; --sapIndicationColor_8_Active_TextColor: #a100c2; --sapIndicationColor_8_Hover_Background: #8c00a9; --sapIndicationColor_9_Active_TextColor: #1d2d3e; --sapIndicationColor_9_Hover_Background: #15202d; --sapObjectHeader_Title_SnappedFontSize: 1.25rem; --sapProgress_Value_CriticalBorderColor: #e76500; --sapProgress_Value_NegativeBorderColor: #f53232; --sapProgress_Value_PositiveBorderColor: #30914c; --sapShell_Navigation_Active_Background: #fff; --sapSlider_Hover_RangeHandleBackground: #e3f0ff; --sapButton_Attention_Active_BorderColor: #dd6100; --sapButton_Attention_Selected_TextColor: #b44f00; --sapButton_Emphasized_Active_Background: #fff; --sapButton_Emphasized_Hover_BorderColor: #0064d9; --sapButton_Information_Active_TextColor: #0064d9; --sapButton_Information_Hover_Background: #d4e8ff; --sapContent_Placeholderloading_Gradient: linear-gradient(to right, #ccc 0%, #ccc 20%, #999 50%, #ccc 80%, #ccc 100%); --sapIndicationColor_10_Active_TextColor: #45484a; --sapIndicationColor_10_Hover_Background: #767b7e; --sapIndicationColor_1_Active_Background: #fff; --sapIndicationColor_1b_Hover_Background: #fa8585; --sapIndicationColor_2_Active_Background: #fff; --sapIndicationColor_2b_Hover_Background: #fbacac; --sapIndicationColor_3_Active_Background: #fff; --sapIndicationColor_3b_Hover_Background: #ffeda6; --sapIndicationColor_4_Active_Background: #fff; --sapIndicationColor_4b_Hover_Background: #a7e2a9; --sapIndicationColor_5_Active_Background: #fff; --sapIndicationColor_5b_Hover_Background: #bbe6fc; --sapIndicationColor_6_Active_Background: #fff; --sapIndicationColor_6b_Hover_Background: #b8f1e4; --sapIndicationColor_7_Active_Background: #fff; --sapIndicationColor_7b_Hover_Background: #cdc2ff; --sapIndicationColor_8_Active_Background: #fff; --sapIndicationColor_8b_Hover_Background: #f4bdff; --sapIndicationColor_9_Active_Background: #fff; --sapIndicationColor_9b_Hover_Background: #f2f2f2; --sapProgress_Value_InformationTextColor: #0070f2; --sapShell_Navigation_Selected_TextColor: #0064d9; --sapSlider_Active_RangeHandleBackground: transparent; --sapButton_Attention_Selected_Background: #fff; --sapButton_Emphasized_Active_BorderColor: #0064d9; --sapButton_Information_Active_Background: #fff; --sapButton_Information_Hover_BorderColor: #b5d8ff; --sapIndicationColor_10_Active_Background: #fff; --sapIndicationColor_10b_Hover_Background: #dcdfe3; --sapIndicationColor_1_Active_BorderColor: #fb9d9d; --sapIndicationColor_1_Selected_TextColor: #840606; --sapIndicationColor_2_Active_BorderColor: #fcc4c4; --sapIndicationColor_2_Selected_TextColor: #aa0808; --sapIndicationColor_3_Active_BorderColor: #fff2c0; --sapIndicationColor_3_Selected_TextColor: #b95100; --sapIndicationColor_4_Active_BorderColor: #bae8bc; --sapIndicationColor_4_Selected_TextColor: #256f3a; --sapIndicationColor_5_Active_BorderColor: #d3effd; --sapIndicationColor_5_Selected_TextColor: #0070f2; --sapIndicationColor_6_Active_BorderColor: #cdf5ec; --sapIndicationColor_6_Selected_TextColor: #046c7a; --sapIndicationColor_7_Active_BorderColor: #e2dbff; --sapIndicationColor_7_Selected_TextColor: #5d36ff; --sapIndicationColor_8_Active_BorderColor: #f8d6ff; --sapIndicationColor_8_Selected_TextColor: #a100c2; --sapIndicationColor_9_Active_BorderColor: #d9d9d9; --sapIndicationColor_9_Selected_TextColor: #1d2d3e; --sapProgress_Value_InformationBackground: #0070f2; --sapButton_Attention_Selected_BorderColor: #dd6100; --sapButton_Information_Active_BorderColor: #0064d9; --sapContent_Placeholderloading_Background: #ccc; --sapIndicationColor_10_Active_BorderColor: #eaecee; --sapIndicationColor_10_Selected_TextColor: #45484a; --sapIndicationColor_1_Selected_Background: #fff; --sapIndicationColor_2_Selected_Background: #fff; --sapIndicationColor_3_Selected_Background: #fff; --sapIndicationColor_4_Selected_Background: #fff; --sapIndicationColor_5_Selected_Background: #fff; --sapIndicationColor_6_Selected_Background: #fff; --sapIndicationColor_7_Selected_Background: #fff; --sapIndicationColor_8_Selected_Background: #fff; --sapIndicationColor_9_Selected_Background: #fff; --sapProgress_Value_InformationBorderColor: #0070f2; --sapButton_Track_Negative_Hover_Background: #e90b0b; --sapButton_Track_Positive_Hover_Background: #2c8646; --sapButton_Track_Selected_Hover_Background: #0058c0; --sapContent_Selected_MeasureIndicatorColor: #0064d9; --sapIndicationColor_10_Selected_Background: #fff; --sapIndicationColor_1_Selected_BorderColor: #fb9d9d; --sapIndicationColor_2_Selected_BorderColor: #fcc4c4; --sapIndicationColor_3_Selected_BorderColor: #fff2c0; --sapIndicationColor_4_Selected_BorderColor: #bae8bc; --sapIndicationColor_5_Selected_BorderColor: #d3effd; --sapIndicationColor_6_Selected_BorderColor: #cdf5ec; --sapIndicationColor_7_Selected_BorderColor: #e2dbff; --sapIndicationColor_8_Selected_BorderColor: #f8d6ff; --sapIndicationColor_9_Selected_BorderColor: #d9d9d9; --sapButton_Accept_Selected_Hover_Background: #e3f1b6; --sapButton_Handle_Negative_Hover_Background: #fff; --sapButton_Handle_Positive_Hover_Background: #fff; --sapButton_Handle_Selected_Hover_Background: #fff; --sapButton_Reject_Selected_Hover_Background: #ffbddb; --sapButton_Track_Negative_Hover_BorderColor: #e90b0b; --sapButton_Track_Positive_Hover_BorderColor: #2c8646; --sapButton_Track_Selected_Hover_BorderColor: #0058c0; --sapContent_ImagePlaceholderForegroundColor: #5b738b; --sapIndicationColor_10_Selected_BorderColor: #eaecee; --sapButton_Accept_Selected_Hover_BorderColor: #30914c; --sapButton_Handle_Negative_Hover_BorderColor: rgba(255,255,255,0.5); --sapButton_Handle_Positive_Hover_BorderColor: rgba(255,255,255,0.5); --sapButton_Handle_Selected_Hover_BorderColor: rgba(255,255,255,0.5); --sapButton_Reject_Selected_Hover_BorderColor: #e90b0b; --sapButton_Attention_Selected_Hover_Background: #ffef9e; --sapButton_Attention_Selected_Hover_BorderColor: #dd6100; } </style></head><body><div id="__next"><div id="page" data-pageref="bltddcb1b9a0f42a3f1" data-contenttype="topic_page_admin" data-locale="en-us"><div id="main"><div><div class="Header_container__hNMsZ"></div><div class="Grid_grid__iLh1n "><div class="Grid_row__73clp TopicPageTemplate_topic-page__subheader-row__00DRi"><div class="Grid_col-lg-12__ZBjff"><div id="bread-crumb-nav" class="Subheader_subheader__U9_o5"><ul class="Subheader_subheader__breadcrumb__mn4CX"><li class="Subheader_subheader__breadcrumb-nav-item__N_64f Subheader_subheader__breadcrumb-nav-item--mobile__OUxiv"><a class="Subheader_subheader__breadcrumb-nav-item__link__EBYWp" href="/topics" title="Topics"><svg class="Subheader_subheader__breadcrumb-nav-item__icon__3Q_Ig Icon_icon__9VjaI" focusable="false" preserveAspectRatio="xMidYMid meet" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" fill="currentcolor"><g role="presentation"><path d="M326 96q11 0 18.5 7.5T352 122q0 10-8 18L223 256l121 116q8 8 8 18 0 11-7.5 18.5T326 416q-10 0-17-7L168 274q-8-6-8-18 0-11 8-19l141-134q7-7 17-7z"></path></g></svg><span>Topics</span></a></li><li id="bread-crumb-nav-item-0" class="Subheader_subheader__breadcrumb-nav-item__N_64f"><a class="Subheader_subheader__breadcrumb-nav-item__link__EBYWp" href="https://community.sap.com" title="SAP Community">SAP Community</a></li><li id="bread-crumb-nav-item-1" class="Subheader_subheader__breadcrumb-nav-item__N_64f"><svg class="Subheader_subheader__breadcrumb-nav-item__icon__3Q_Ig Icon_icon__9VjaI" focusable="false" preserveAspectRatio="xMidYMid meet" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" fill="currentcolor"><g role="presentation"><path d="M186 416q-11 0-18.5-7.5T160 390q0-10 8-18l121-116-121-116q-8-8-8-18 0-11 7.5-18.5T186 96q10 0 17 7l141 134q8 8 8 19 0 12-8 18L203 409q-7 7-17 7z"></path></g></svg><a class="Subheader_subheader__breadcrumb-nav-item__link__EBYWp" href="/topics" title="Topics">Topics</a></li></ul></div></div></div></div><div class="Grid_grid__iLh1n TopicPageTemplate_topic-page__herounit-grid__NKIw3"><div class="Grid_row__73clp "><div class="Grid_col-sm-12__UMsUU Grid_col-md-12__WYbxp Grid_col-lg-7__BIb3h"><div id="hero-unit" class="HeroUnit_hero-unit__o3nhU"><h1 id="title" class="HeroUnit_hero-unit__title__caIqD">SAP Fiori elements</h1><h2 id="description" class="HeroUnit_hero-unit__description__1G4nK">Improve the efficiency of your development teams and ensure consistency across your SAP apps by using standard page types to build applications. Using SAP Fiori elements to build apps that rely on SAP data can save you time and money on both development and maintenance costs. SAP Fiori elements is a library of several common floorplans that gives you a head start on developing applications that connect to data in SAP back-end systems.</h2></div></div></div></div><div class="TopicPageTemplate_topic-page__content-wrapper__s8i7P"><div class="Grid_grid__iLh1n TopicPageTemplate_topic-page__content-grid__ZXRaB"><div class="Grid_row__73clp "><div class="Grid_col-sm-12__UMsUU Grid_col-md-12__WYbxp Grid_col-lg-8__cj5hI"><div class="FeaturedContentWidget_featured-content__xfnof"><ui5-title level="H2">Featured Content</ui5-title><ui5-carousel cyclic="true" arrows-placement="Navigation" background-design="Translucent" items-per-page-l="2" items-per-page-m="2" items-per-page-s="1" page-indicator-background-design="Transparent" page-indicator-border-design="None" page-indicator-style="Default" title="Featured Content" class="FeaturedContentWidget_featured-content__xfnof"><div class="FeaturedContentWidget_carousel__Ojt__"><ui5-card class="FeaturedContentWidget_card__9TLNA"><div class="FeaturedContentWidget_content__dZmIz"><div class="FeaturedContentWidget_header__dwGwo"><span style="background-image:url('https://pages.community.sap.com/images/bltfc04023f7867798f/282961_GettyImages-697538579-1.jpg')" role="img" class="FeaturedContentWidget_image__KEWLS"></span></div></div><div class="FeaturedContentWidget_text__fs9vs"><div class="FeaturedContentWidget_title__dYdSz">Read how to build SAP Fiori apps at scale</div><div class="EditorContent_editor-content__RRtAP FeaturedContentWidget_description__bFMZc"><p></p><p>Read our expert paper about using SAP Fiori elements and SAP Fiori tools to improve developer productivity while delivering a consistent user experience in enterprise-scale apps.</p><a href="https://www.sap.com/documents/2021/05/fce40d55-e37d-0010-bca6-c68f7e60039b.html" target="_blank" rel="noopener noreferrer">Download the paper</a><p></p></div></div></ui5-card></div><div class="FeaturedContentWidget_carousel__Ojt__"><ui5-card class="FeaturedContentWidget_card__9TLNA"><div class="FeaturedContentWidget_content__dZmIz"><div class="FeaturedContentWidget_header__dwGwo"><span style="background-image:url('https://pages.community.sap.com/images/blt1f9865a59bea5ae0/287641_GettyImages-508251602_small-1.jpg')" role="img" class="FeaturedContentWidget_image__KEWLS"></span></div></div><div class="FeaturedContentWidget_text__fs9vs"><div class="FeaturedContentWidget_title__dYdSz">Attend a free course on SAP Fiori elements</div><div class="EditorContent_editor-content__RRtAP FeaturedContentWidget_description__bFMZc"><p>Learn how to build SAP Fiori apps using the same technologies and tools that SAP uses for SAP Fiori app development for SAP S/4HANA: SAP Fiori elements and SAP Fiori tools.</p><p><a href="https://learning.sap.com/courses/developing-and-extending-sap-fiori-elements-apps" target="_self">View the course</a></p></div></div></ui5-card></div><div class="FeaturedContentWidget_carousel__Ojt__"><ui5-card class="FeaturedContentWidget_card__9TLNA"><div class="FeaturedContentWidget_content__dZmIz"><div class="FeaturedContentWidget_header__dwGwo"><span style="background-image:url('https://pages.community.sap.com/images/blt5e2ffec936898b21/284037_GettyImages-769719673-1.jpg')" role="img" class="FeaturedContentWidget_image__KEWLS"></span></div></div><div class="FeaturedContentWidget_text__fs9vs"><div class="FeaturedContentWidget_title__dYdSz">Watch the Using SAP Fiori elements video series</div><div class="EditorContent_editor-content__RRtAP FeaturedContentWidget_description__bFMZc"><p></p> <p>This video series features developers explaining how they use SAP Fiori elements to build their apps and how it saves them time and delivers a consistent user experience every time.</p><a href="https://www.youtube.com/playlist?list=PLo17W6sWsxWOqcFs38y6EjjBaS3eIFLCP" target="_blank" rel="noopener noreferrer">Watch the videos</a> <p></p></div></div></ui5-card></div><div class="FeaturedContentWidget_carousel__Ojt__"><ui5-card class="FeaturedContentWidget_card__9TLNA"><div class="FeaturedContentWidget_content__dZmIz"><div class="FeaturedContentWidget_header__dwGwo"><span style="background-image:url('https://pages.community.sap.com/images/blt9b7bfa6631913c4f/276440_276440_h_ergb_s_gl-1.jpg')" role="img" class="FeaturedContentWidget_image__KEWLS"></span></div></div><div class="FeaturedContentWidget_text__fs9vs"><div class="FeaturedContentWidget_title__dYdSz">Learn about the different floorplans that SAP Fiori elements supports</div><div class="EditorContent_editor-content__RRtAP FeaturedContentWidget_description__bFMZc"><p>SAP Fiori elements has different floorplans to suit most business scenarios: • Overview page • List report • Object page • Analytical list report • Worklist</p><a href="https://experience.sap.com/fiori-design-web/smart-templates/" rel="noopener noreferrer">Learn about floorplans</a></div></div></ui5-card></div><div class="FeaturedContentWidget_carousel__Ojt__"><ui5-card class="FeaturedContentWidget_card__9TLNA"><div class="FeaturedContentWidget_content__dZmIz"><div class="FeaturedContentWidget_header__dwGwo"><span style="background-image:url('https://pages.community.sap.com/images/bltfc04023f7867798f/282961_GettyImages-697538579-1.jpg')" role="img" class="FeaturedContentWidget_image__KEWLS"></span></div></div><div class="FeaturedContentWidget_text__fs9vs"><div class="FeaturedContentWidget_title__dYdSz">Read how SAP Fiori elements streamlines SAPUI5 development</div><div class="EditorContent_editor-content__RRtAP FeaturedContentWidget_description__bFMZc"><p>SAP Fiori elements generates SAP Fiori apps at runtime from existing OData services. It uses annotations to define attributes and relationships among your data. It is built on top of SAPUI5, SAP’s HTML5 development toolkit.</p><a href="https://sapui5.hana.ondemand.com/#/topic/03265b0408e2432c9571d6b3feb6b1fd" target="_blank" rel="noopener noreferrer">Read the documentation</a></div></div></ui5-card></div><div class="FeaturedContentWidget_carousel__Ojt__"><ui5-card class="FeaturedContentWidget_card__9TLNA"><div class="FeaturedContentWidget_content__dZmIz"><div class="FeaturedContentWidget_header__dwGwo"><span style="background-image:url('https://pages.community.sap.com/images/bltef161109bf1aefe3/276402_276402_h_ergb_s_gl-1.jpg')" role="img" class="FeaturedContentWidget_image__KEWLS"></span></div></div><div class="FeaturedContentWidget_text__fs9vs"><div class="FeaturedContentWidget_title__dYdSz">Leverage the flexible programming model using OData V4</div><div class="EditorContent_editor-content__RRtAP FeaturedContentWidget_description__bFMZc"><p>The flexible programming model makes it easy to extend apps based on SAP Fiori elements for OData V4. Using building blocks lets you adapt your apps with a minimal amount of custom SAPUI5 coding. </p> <p><a href="https://blogs.sap.com/2021/08/19/leverage-the-flexible-programming-model-to-extend-your-sap-fiori-elements-apps-for-odata-v4/">Read about the flexible programming model</a></p></div></div></ui5-card></div></ui5-carousel></div><div class="BlockComponentsWidget_block-components__MjW7X"><ui5-title level="H2">Expert Content</ui5-title><div class="BlockComponentsWidget_block-components__content-wrapper__RB2s7"><div class="ContentCard_content-card__Gun71 ContentCard_content-card--beside__jHu16"><div class="ContentCard_image__FBiHm"><img alt="" fetchpriority="high" width="300" height="200" decoding="async" data-nimg="1" style="color:transparent;width:100%;height:inherit;max-height:inherit" sizes="100vw" srcSet="/_next/image?url=https%3A%2F%2Fpages.community.sap.com%2Fimages%2Fbltd2cec5a5ddf00594%2Flogo_k4u_ohnetypo-1.png&w=640&q=75 640w, /_next/image?url=https%3A%2F%2Fpages.community.sap.com%2Fimages%2Fbltd2cec5a5ddf00594%2Flogo_k4u_ohnetypo-1.png&w=750&q=75 750w, /_next/image?url=https%3A%2F%2Fpages.community.sap.com%2Fimages%2Fbltd2cec5a5ddf00594%2Flogo_k4u_ohnetypo-1.png&w=828&q=75 828w, /_next/image?url=https%3A%2F%2Fpages.community.sap.com%2Fimages%2Fbltd2cec5a5ddf00594%2Flogo_k4u_ohnetypo-1.png&w=1080&q=75 1080w, /_next/image?url=https%3A%2F%2Fpages.community.sap.com%2Fimages%2Fbltd2cec5a5ddf00594%2Flogo_k4u_ohnetypo-1.png&w=1200&q=75 1200w, /_next/image?url=https%3A%2F%2Fpages.community.sap.com%2Fimages%2Fbltd2cec5a5ddf00594%2Flogo_k4u_ohnetypo-1.png&w=1920&q=75 1920w, /_next/image?url=https%3A%2F%2Fpages.community.sap.com%2Fimages%2Fbltd2cec5a5ddf00594%2Flogo_k4u_ohnetypo-1.png&w=2048&q=75 2048w, /_next/image?url=https%3A%2F%2Fpages.community.sap.com%2Fimages%2Fbltd2cec5a5ddf00594%2Flogo_k4u_ohnetypo-1.png&w=3840&q=75 3840w" src="/_next/image?url=https%3A%2F%2Fpages.community.sap.com%2Fimages%2Fbltd2cec5a5ddf00594%2Flogo_k4u_ohnetypo-1.png&w=3840&q=75"/></div><div class="ContentCard_content__E51nM"><h3 class="ContentCard_title__5PgNU">SAP Fiori elements on the SAP Community</h3><div class="EditorContent_editor-content__RRtAP undefined"><p>Visit the <a href="https://blogs.sap.com/tags/ed5c1ef6-932f-4c19-b2ba-1be375109ff5/">SAP Community blogs for SAP Fiori elements</a> to keep up to date with new features and more.</p><a href="https://roadmaps.sap.com/board?PRODUCT=000D3AAADBCE1EEBA3CA43CF76074694&range=2021Q2-2022Q1#Q3%202021" target="_blank" rel="noopener noreferrer">See the latest roadmap for SAP Fiori elements</a></div></div></div></div><div class="BlockComponentsWidget_block-components__content-wrapper__RB2s7"><div class="ContentCard_content-card__Gun71 ContentCard_content-card--beside__jHu16"><div class="ContentCard_image__FBiHm"><img alt="" fetchpriority="high" width="300" height="200" decoding="async" data-nimg="1" style="color:transparent;width:100%;height:inherit;max-height:inherit" src="https://pages.community.sap.com/images/bltc2a2754b4a07b51d/281738-pictogram-blue-1.svg"/></div><div class="ContentCard_content__E51nM"><h3 class="ContentCard_title__5PgNU">Get Help</h3><div class="EditorContent_editor-content__RRtAP undefined"><p>Need additional assistance? Visit the SAP Fiori Help Portal for compatibility, functionality, and application development assistance.<br />Note: Please use component CA-UI5-ST (OData V2) or CA-UI5-FE (OData V4) to file an incident with the SAP Fiori elements team. We will be in touch as soon as possible.</p><a href="https://sapui5.hana.ondemand.com/#/topic/03265b0408e2432c9571d6b3feb6b1fd" target="_blank" rel="noopener noreferrer">Visit the SAP Fiori elements documentation</a><br /><a href="https://www.sap.com/cmp/nl/sap-fiori-development-newsletter/index.html" target="_blank" rel="noopener noreferrer">Subscribe to the SAP Fiori development newsletter</a><br /><a href="https://community.sap.com/t5/enterprise-resource-planning-blogs-by-sap/sap-fiori-development-newsletter-may-2024-issue-28/ba-p/13702765" target="_blank" rel="noopener noreferrer">Read the latest issue of the SAP Fiori development newsletter (May2024)</a> <br /><br /></div></div></div></div><div class="BlockComponentsWidget_block-components__content-wrapper__RB2s7"><div class="ContentCard_content-card__Gun71 ContentCard_content-card--beside__jHu16"><div class="ContentCard_image__FBiHm"><img alt="" fetchpriority="high" width="300" height="200" decoding="async" data-nimg="1" style="color:transparent;width:100%;height:inherit;max-height:inherit" sizes="100vw" srcSet="/_next/image?url=https%3A%2F%2Fpages.community.sap.com%2Fimages%2Fbltd5a8b08ba735aa3c%2F281091-1.png&w=640&q=75 640w, /_next/image?url=https%3A%2F%2Fpages.community.sap.com%2Fimages%2Fbltd5a8b08ba735aa3c%2F281091-1.png&w=750&q=75 750w, /_next/image?url=https%3A%2F%2Fpages.community.sap.com%2Fimages%2Fbltd5a8b08ba735aa3c%2F281091-1.png&w=828&q=75 828w, /_next/image?url=https%3A%2F%2Fpages.community.sap.com%2Fimages%2Fbltd5a8b08ba735aa3c%2F281091-1.png&w=1080&q=75 1080w, /_next/image?url=https%3A%2F%2Fpages.community.sap.com%2Fimages%2Fbltd5a8b08ba735aa3c%2F281091-1.png&w=1200&q=75 1200w, /_next/image?url=https%3A%2F%2Fpages.community.sap.com%2Fimages%2Fbltd5a8b08ba735aa3c%2F281091-1.png&w=1920&q=75 1920w, /_next/image?url=https%3A%2F%2Fpages.community.sap.com%2Fimages%2Fbltd5a8b08ba735aa3c%2F281091-1.png&w=2048&q=75 2048w, /_next/image?url=https%3A%2F%2Fpages.community.sap.com%2Fimages%2Fbltd5a8b08ba735aa3c%2F281091-1.png&w=3840&q=75 3840w" src="/_next/image?url=https%3A%2F%2Fpages.community.sap.com%2Fimages%2Fbltd5a8b08ba735aa3c%2F281091-1.png&w=3840&q=75"/></div><div class="ContentCard_content__E51nM"><h3 class="ContentCard_title__5PgNU">Getting Started</h3><div class="EditorContent_editor-content__RRtAP undefined"><a href="https://learning.sap.com/courses/developing-and-extending-sap-fiori-elements-apps" target="_blank" rel="noopener noreferrer">SAP Learning course: Developing and Extending SAP Fiori Elements Apps</a><br /><a href="https://www.youtube.com/playlist?list=PLo17W6sWsxWP4RMYXd7l824ss5KriAbwm" target="_blank" rel="noopener noreferrer">Getting started with SAP Fiori elements video series</a><br /><a href="https://d.dam.sap.com/a/7JMn4gA" target="_blank" rel="noopener noreferrer">Read the SAP Fiori elements expert paper</a><br /><a href="https://sapui5.hana.ondemand.com/#/topic/62d3f7c2a9424864921184fd6c7002eb" target="_blank" rel="noopener noreferrer">SAP Fiori elements feature map</a><p><a href="https://www.youtube.com/playlist?list=PLo17W6sWsxWM0yervb4VUxglVAop34_DQ" target="_self">Introduction to the flexible programming model video series (OData V4)</a></p><p><a href="https://sapui5.hana.ondemand.com/test-resources/sap/fe/core/fpmExplorer/index.html#/overview/introduction" target="_self">SAP Fiori elements flexible programming model explorer (OData V4)</a><a href="https://experience.sap.com/fiori-design-web/smart-templates/#" target="_self"><br />Design guidelines for SAP Fiori elements</a><br /></p></div></div></div></div><div class="BlockComponentsWidget_block-components__content-wrapper__RB2s7"><div class="ContentCard_content-card__Gun71 ContentCard_content-card--beside__jHu16"><div class="ContentCard_image__FBiHm"><img alt="" fetchpriority="high" width="300" height="200" decoding="async" data-nimg="1" style="color:transparent;width:100%;height:inherit;max-height:inherit" sizes="100vw" srcSet="/_next/image?url=https%3A%2F%2Fpages.community.sap.com%2Fimages%2Fblt4c969072e7bf2b7b%2F283063_Media_center_R_blue-1.png&w=640&q=75 640w, /_next/image?url=https%3A%2F%2Fpages.community.sap.com%2Fimages%2Fblt4c969072e7bf2b7b%2F283063_Media_center_R_blue-1.png&w=750&q=75 750w, /_next/image?url=https%3A%2F%2Fpages.community.sap.com%2Fimages%2Fblt4c969072e7bf2b7b%2F283063_Media_center_R_blue-1.png&w=828&q=75 828w, /_next/image?url=https%3A%2F%2Fpages.community.sap.com%2Fimages%2Fblt4c969072e7bf2b7b%2F283063_Media_center_R_blue-1.png&w=1080&q=75 1080w, /_next/image?url=https%3A%2F%2Fpages.community.sap.com%2Fimages%2Fblt4c969072e7bf2b7b%2F283063_Media_center_R_blue-1.png&w=1200&q=75 1200w, /_next/image?url=https%3A%2F%2Fpages.community.sap.com%2Fimages%2Fblt4c969072e7bf2b7b%2F283063_Media_center_R_blue-1.png&w=1920&q=75 1920w, /_next/image?url=https%3A%2F%2Fpages.community.sap.com%2Fimages%2Fblt4c969072e7bf2b7b%2F283063_Media_center_R_blue-1.png&w=2048&q=75 2048w, /_next/image?url=https%3A%2F%2Fpages.community.sap.com%2Fimages%2Fblt4c969072e7bf2b7b%2F283063_Media_center_R_blue-1.png&w=3840&q=75 3840w" src="/_next/image?url=https%3A%2F%2Fpages.community.sap.com%2Fimages%2Fblt4c969072e7bf2b7b%2F283063_Media_center_R_blue-1.png&w=3840&q=75"/></div><div class="ContentCard_content__E51nM"><h3 class="ContentCard_title__5PgNU">Events</h3><div class="EditorContent_editor-content__RRtAP undefined"><p><a href="https://events.sap.com/noam/sap-fiori-innovation-day-chicago-2024/en/home" target="_self">SAP Fiori Innovation Day</a> (Chicago, August 13, 2024)</p><p><a href="https://github.com/SAP-samples/teched2023-DT262" target="_self">Boost your productivity in developing SAPUI5 apps with SAP Fiori tools (SAP TechEd 2023 session DT262)</a></p><p><a href="https://go3.events.sap.com/sapteched/hybrid/2022/reg/flow/sap/saptech2022/sapteched2022catalog/page/catalog/session/1661198037900001EyoI" target="_self">Boost Your Productivity in Developing SAP Fiori Apps (SAP TechEd 2022 hands-on session DT181)</a></p><p><a href="https://youtu.be/cFv_pkVcB4Y" target="_self">UI5con 2022 keynote on what's new in SAP Fiori elements and SAP Fiori tools</a></p><p><a href="https://reg.sapevents.sap.com/flow/sap/sapteched2021/portal/page/sessions/session/16303673724730013AoR" target="_self">Build timeless and low-maintenance SAP Fiori apps faster than ever (SAP TechEd 2021 lecture session IIS108)</a></p><p><a href="https://reg.sapevents.sap.com/flow/sap/sapteched2021/portal/page/sessions/session/163036737298900134yv" target="_self">Accelerate the development of SAP Fiori apps using SAP Fiori elements (SAP TechEd 2021 hands-on session IIS160)</a></p><br /></div></div></div></div></div></div><div class="Grid_col-lg-4__57gvc"><div class="TopicPageTemplate_topic-page__sidebar__nIvJH"><div class="NavigationWidget_navigation-wrapper__Vv7Qf"><ui5-side-navigation title="SAP Fiori elements"><div class="NavigationWidget_header__8UocB" slot="header"><ui5-title level="H4" class="NavigationWidget_title___4yyD">Browse this Topic</ui5-title><div class="NavigationWidget_root__Epq35"><ui5-link accessible-role="link" design="Default" href="/topics/fiori-elements" class="NavigationWidget_active__b4hPV">SAP Fiori elements</ui5-link></div></div><ui5-side-navigation-item text="SAP Fiori Elements FAQ"></ui5-side-navigation-item></ui5-side-navigation></div><div id="resource-list" class="Resources_resource-list__rOqOa"><ui5-card class="Resources_resource__pKmES"><ui5-card-header title-text="Related Resources" id="resource-title-0" slot="header" tabIndex="-1"></ui5-card-header><div class="Resources_resource__content__DuFUl"><a id="resource-link-0-0" class="Resources_resource__link__HxtWd" href="https://sapui5.hana.ondemand.com/#/topic/03265b0408e2432c9571d6b3feb6b1fd" target="_blank">SAP Help Portal for SAP Fiori elements</a><a id="resource-link-0-1" class="Resources_resource__link__HxtWd" href="https://learning.sap.com/courses/developing-and-extending-sap-fiori-elements-apps" target="_blank">"Developing and Extending SAP Fiori Elements Apps" SAP Learning course</a><a id="resource-link-0-2" class="Resources_resource__link__HxtWd" href="https://www.youtube.com/playlist?list=PLo17W6sWsxWP4RMYXd7l824ss5KriAbwm" target="_blank">Getting started with SAP Fiori elements video series</a><a id="resource-link-0-3" class="Resources_resource__link__HxtWd" href="https://youtu.be/8A3gVJLgbbg" target="_blank">SAP online track video on SAP Fiori elements</a><a id="resource-link-0-4" class="Resources_resource__link__HxtWd" href="https://sapui5.hana.ondemand.com/test-resources/sap/fe/core/fpmExplorer/index.html" target="_blank">SAP Fiori elements Flexible Programming Model explorer</a></div></ui5-card><ui5-card class="Resources_resource__pKmES"><ui5-card-header title-text="Related community topics" id="resource-title-1" slot="header" tabIndex="-1"></ui5-card-header><div class="Resources_resource__content__DuFUl"><a id="resource-link-1-0" class="Resources_resource__link__HxtWd" href="https://community.sap.com/topics/fiori-tools" target="_self">SAP Fiori tools</a><a id="resource-link-1-1" class="Resources_resource__link__HxtWd" href="https://community.sap.com/topics/fiori" target="_self">SAP Fiori</a><a id="resource-link-1-2" class="Resources_resource__link__HxtWd" href="https://community.sap.com/topics/ui5" target="_self">SAPUI5</a><a id="resource-link-1-3" class="Resources_resource__link__HxtWd" href="https://community.sap.com/topics/business-application-studio" target="_self">SAP Business Application Studio</a><a id="resource-link-1-4" class="Resources_resource__link__HxtWd" href="https://community.sap.com/topics/cloud-application-programming" target="_self">SAP Cloud Application Programming Model (CAP)</a><a id="resource-link-1-5" class="Resources_resource__link__HxtWd" href="https://community.sap.com/topics/abap" target="_self">SAP ABAP Development (includes RAP)</a><a id="resource-link-1-6" class="Resources_resource__link__HxtWd" href="https://pages.community.sap.com/topics/s4hana-ms-teams" target="_self">Share with Microsoft Teams</a></div></ui5-card><ui5-card class="Resources_resource__pKmES"><ui5-card-header title-text="Related blog posts" id="resource-title-2" slot="header" tabIndex="-1"></ui5-card-header><div class="Resources_resource__content__DuFUl"><a id="resource-link-2-0" class="Resources_resource__link__HxtWd" href="https://blogs.sap.com/2022/11/02/sap-fiori-tools-2211-update-includes-typescript-support-easier-troubleshooting-flexible-programming-model-support-and-more/" target="_blank">Latest SAP Fiori tools adds more low-code capabilities</a><a id="resource-link-2-1" class="Resources_resource__link__HxtWd" href="https://roadmaps.sap.com/board?q=sapui5&range=2023Q1-2024Q4#Q1%202023" target="_blank">SAP Fiori elements roadmap update</a><a id="resource-link-2-2" class="Resources_resource__link__HxtWd" href="https://blogs.sap.com/2020/11/27/sap-fiori-elements-now-support-odata-v4/" target="_blank">SAP Fiori elements now supports OData V4</a><a id="resource-link-2-3" class="Resources_resource__link__HxtWd" href="https://blogs.sap.com/2022/12/08/video-series-on-flexible-programming-model-for-sap-fiori-elements/" target="_blank">Flexible Programming Model simplifies adding custom code</a><a id="resource-link-2-4" class="Resources_resource__link__HxtWd" href="https://blogs.sap.com/2020/06/22/sap-fiori-tools-is-generally-available.-increase-the-efficiency-of-developing-sap-fiori-elements-apps/" target="_blank">SAP Fiori tools release announcement and overview</a><a id="resource-link-2-5" class="Resources_resource__link__HxtWd" href="https://blogs.sap.com/2020/01/17/yorkshire-water-uses-sap-fiori-elements-to-build-fiori-apps-quickly/" target="_blank">Yorkshire Water uses SAP Fiori elements to build Fiori apps quickly</a><a id="resource-link-2-6" class="Resources_resource__link__HxtWd" href="https://blogs.sap.com/2019/11/20/linde-uses-sap-fiori-elements-to-reduce-pressure-on-their-development-pipeline/" target="_blank">Linde uses SAP Fiori elements to reduce pressure on their development pipeline</a><a id="resource-link-2-7" class="Resources_resource__link__HxtWd" href="https://blogs.sap.com/2021/07/12/compact-feature-availability-matrix-of-abap-programming-models/" target="_blank">Feature matrix on ABAP backend support</a></div></ui5-card><ui5-card class="Resources_resource__pKmES"><ui5-card-header title-text="Developer Documentation" id="resource-title-3" slot="header" tabIndex="-1"></ui5-card-header><div class="Resources_resource__content__DuFUl"><a id="resource-link-3-0" class="Resources_resource__link__HxtWd" href="https://sapui5.hana.ondemand.com/#/topic/03265b0408e2432c9571d6b3feb6b1fd" target="_blank">Introduction</a><a id="resource-link-3-1" class="Resources_resource__link__HxtWd" href="https://sapui5.hana.ondemand.com/#/topic/c64ef8c6c65d4effbfd512e9c9aa5044" target="_blank">Overview page</a><a id="resource-link-3-2" class="Resources_resource__link__HxtWd" href="https://sapui5.hana.ondemand.com/#/topic/1cf5c7f5b81c4cb3ba98fd14314d4504" target="_blank">List report page</a><a id="resource-link-3-3" class="Resources_resource__link__HxtWd" href="https://sapui5.hana.ondemand.com/#/topic/645e27ae85d54c8cbc3f6722184a24a1" target="_blank">Object page</a><a id="resource-link-3-4" class="Resources_resource__link__HxtWd" href="https://sapui5.hana.ondemand.com/#/topic/3d33684b08ca4490b26a844b6ce19b83" target="_blank">Analytical list report page</a><a id="resource-link-3-5" class="Resources_resource__link__HxtWd" href="https://sapui5.hana.ondemand.com/#/topic/d1d588f1061b4bac96a1facb80d3f3a2" target="_blank">Worklist page</a><a id="resource-link-3-6" class="Resources_resource__link__HxtWd" href="https://help.sap.com/viewer/468a97775123488ab3345a0c48cadd8f/201809.000/en-US/03265b0408e2432c9571d6b3feb6b1fd.html" target="_blank">help.sap.com for SAP Fiori elements</a></div></ui5-card></div><ui5-card aria-label="Follow Us" class="SocialMedia_social-media__BV9js"><ui5-card-header title-text="Follow Us" id="social-media-title" slot="header" tabIndex="-1"></ui5-card-header><div class="SocialMedia_icons-row__pmQI9"><a id="instagram" class="SocialIcon_socialIcon__A8v2h" href="https://instagram.com/sap/" title="Visit the Instagram page" target="_blank"><svg class="SocialIcon_icon__g3D7t Icon_icon__9VjaI" focusable="false" preserveAspectRatio="xMidYMid meet" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 22 22" fill="currentcolor"><g role="presentation"><path d="M21.6879 6.73512C21.5394 5.00026 21.2425 3.55454 19.9064 2.39796C18.5704 1.09682 17.0858 0.807673 15.4528 0.663101C13.6714 0.518529 8.32705 0.518529 6.54561 0.663101C4.76417 0.663101 3.27963 1.09682 2.092 2.25339C0.904373 3.40997 0.459013 5.00026 0.310559 6.59055C0.162105 8.32542 0.162105 13.53 0.310559 15.2649C0.459013 16.9997 0.75592 18.4455 2.092 19.602C3.42808 20.9032 4.91262 21.1923 6.54561 21.3369C8.32705 21.4815 13.6714 21.4815 15.4528 21.3369C17.2343 21.1923 18.7188 20.9032 19.9064 19.602C21.2425 18.3009 21.5394 16.8552 21.6879 15.2649C21.8363 13.6746 21.8363 8.46999 21.6879 6.73512ZM16.7889 6.73526C17.5311 6.73526 18.1249 6.15698 18.1249 5.43412C18.1249 4.71126 17.5311 4.13297 16.7889 4.13297C16.0466 4.13297 15.4528 4.71126 15.4528 5.43412C15.4528 6.15698 16.0466 6.73526 16.7889 6.73526ZM10.9991 5.72313C7.88158 5.72313 5.50632 8.18086 5.50632 11.0723C5.50632 13.9637 8.03003 16.4215 10.9991 16.4215C13.9682 16.4215 16.4919 13.9637 16.4919 11.0723C16.4919 8.18086 14.1166 5.72313 10.9991 5.72313ZM10.9994 14.5421C9.0695 14.5421 7.43651 12.9518 7.43651 11.0724C7.43651 9.19297 9.0695 7.60267 10.9994 7.60267C12.9293 7.60267 14.5623 9.19297 14.5623 11.0724C14.5623 12.9518 12.9293 14.5421 10.9994 14.5421ZM17.3826 19.313C18.4218 18.8793 19.0156 18.1564 19.461 17.289C19.9647 16.0625 19.9343 13.5876 19.9135 11.8942C19.9097 11.5914 19.9063 11.3136 19.9063 11.0724C19.9063 10.8311 19.9097 10.5533 19.9135 10.2506C19.9343 8.55712 19.9647 6.08219 19.461 4.85576C19.0156 3.84375 18.2733 3.26546 17.3826 2.83175C16.1232 2.34117 13.5819 2.3708 11.843 2.39108C11.532 2.3947 11.2468 2.39803 10.9991 2.39803C10.7514 2.39803 10.4662 2.3947 10.1552 2.39108C8.41634 2.3708 5.87496 2.34117 4.6156 2.83175C3.57642 3.26546 2.9826 3.98832 2.53724 4.85576C2.09188 6.30148 2.09188 9.48206 2.09188 11.0724C2.09188 12.6627 2.09188 15.8432 2.53724 17.289C2.9826 18.301 3.72487 18.8793 4.6156 19.313C6.10013 19.7467 9.36611 19.7467 10.9991 19.7467C11.2468 19.7467 11.532 19.75 11.843 19.7536C13.5819 19.7739 16.1232 19.8035 17.3826 19.313Z"></path></g></svg></a><a id="linkedin" class="SocialIcon_socialIcon__A8v2h" href="https://www.linkedin.com/company/sap" title="Visit the LinkedIn page" target="_blank"><svg class="SocialIcon_icon__g3D7t Icon_icon__9VjaI" focusable="false" preserveAspectRatio="xMidYMid meet" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 18 18" fill="currentcolor"><g role="presentation"><path d="M2.13986 4.46442C1.00699 4.46442 0 3.48376 0 2.38051C0 1.27726 1.00699 0.2966 2.13986 0.2966C3.27273 0.2966 4.27972 1.27726 4.27972 2.38051C4.27972 3.48376 3.3986 4.46442 2.13986 4.46442ZM4.02804 17.7034H0.251807V6.05805H4.02804V17.7034ZM14.3497 17.7034H18L17.8741 11.3291C17.8741 8.2645 17.2448 5.81284 13.4685 5.81284C11.7063 5.81284 10.4475 6.7935 9.94405 7.65158V6.058H6.54543V17.7034H10.1958V11.942C10.1958 10.471 10.5734 9 12.4615 9C14.3497 9 14.3497 10.7162 14.3497 12.0646V17.7034Z"></path></g></svg></a><a id="youtube" class="SocialIcon_socialIcon__A8v2h" href="https://www.youtube.com/user/sapcommunities" title="Visit the Youtube page" target="_blank"><svg class="SocialIcon_icon__g3D7t Icon_icon__9VjaI" focusable="false" preserveAspectRatio="xMidYMid meet" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 22 16" fill="currentcolor"><g role="presentation"><path d="M19.6946 1.06041C20.6358 1.19135 21.3081 1.97696 21.577 2.89351C21.9803 4.59567 21.7114 8 21.7114 8C21.7114 8 21.7114 11.4043 21.3081 13.1065C21.0392 14.023 20.3669 14.6777 19.4257 14.9396C17.6779 15.3324 10.9553 15.3324 10.9553 15.3324C10.9553 15.3324 4.23276 15.3324 2.48489 14.9396C1.54373 14.6777 0.871475 14.023 0.602572 13.1065C0.199219 11.4043 0.199219 8 0.199219 8C0.199219 8 0.199219 4.59567 0.737024 2.89351C1.00593 1.97696 1.67818 1.32228 2.75379 1.06041C4.50166 0.667603 11.2242 0.667603 11.2242 0.667603C11.2242 0.667603 17.9468 0.667603 19.6946 1.06041ZM14.5855 7.99976L8.93856 4.8573V11.1422L14.5855 7.99976Z"></path></g></svg></a><a id="bluesky" class="SocialIcon_socialIcon__A8v2h" href="https://bsky.app/profile/sapcommunity.bsky.social" title="Visit the Bluesky page" target="_blank"><svg class="SocialIcon_icon__g3D7t Icon_icon__9VjaI" focusable="false" preserveAspectRatio="xMidYMid meet" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 568 501" fill="currentcolor"><g role="presentation"><path d="M123.121 33.6637C188.241 82.5526 258.281 181.681 284 234.873C309.719 181.681 379.759 82.5526 444.879 33.6637C491.866 -1.61183 568 -28.9064 568 57.9464C568 75.2916 558.055 203.659 552.222 224.501C531.947 296.954 458.067 315.434 392.347 304.249C507.222 323.8 536.444 388.56 473.333 453.32C353.473 576.312 301.061 422.461 287.631 383.039C285.169 375.812 284.017 372.431 284 375.306C283.983 372.431 282.831 375.812 280.369 383.039C266.939 422.461 214.527 576.312 94.6667 453.32C31.5556 388.56 60.7778 323.8 175.653 304.249C109.933 315.434 36.0535 296.954 15.7778 224.501C9.94525 203.659 0 75.2916 0 57.9464C0 -28.9064 76.1345 -1.61183 123.121 33.6637Z"></path></g></svg></a><a id="x" class="SocialIcon_socialIcon__A8v2h" href="https://x.com/sapcommunity" title="Visit the X page" target="_blank"><svg class="SocialIcon_icon__g3D7t Icon_icon__9VjaI" focusable="false" preserveAspectRatio="xMidYMid meet" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1200 1227" fill="currentcolor"><g role="presentation"><path d="M714.163 519.284L1160.89 0H1055.03L667.137 450.887L357.328 0H0L468.492 681.821L0 1226.37H105.866L515.491 750.218L842.672 1226.37H1200L714.137 519.284H714.163ZM569.165 687.828L521.697 619.934L144.011 79.6944H306.615L611.412 515.685L658.88 583.579L1055.08 1150.3H892.476L569.165 687.854V687.828Z"></path></g></svg></a><a id="facebook" class="SocialIcon_socialIcon__A8v2h" href="https://www.facebook.com/SAPcommunity" title="Visit the Facebook page" target="_blank"><svg class="SocialIcon_icon__g3D7t Icon_icon__9VjaI" focusable="false" preserveAspectRatio="xMidYMid meet" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 12 22" fill="currentcolor"><g role="presentation"><path d="M3.54318 21.6633V12.0937H0.314453V8.26582H3.68356V5.25822C3.68356 1.97721 5.78925 0.199997 8.73722 0.199997C10.141 0.199997 11.4044 0.336706 11.6852 0.336706V3.89114H9.5795C7.89494 3.89114 7.61419 4.71139 7.61419 5.80506V8.40253H11.2641L10.7025 12.2304H7.47381V21.8"></path></g></svg></a></div></ui5-card></div></div></div></div></div></div></div><ds-footer navigation-items="[{"url":"https://pages.community.sap.com/resources/sap-community-privacy-statement","title":"Privacy Statement","target":"_blank","label":"Privacy"},{"url":"https://sap.com/corporate/en/legal/terms-of-use.html","title":"Access the Terms of Use","target":"_blank","label":"Terms of Use"},{"url":"https://sap.com/about/legal/impressum.html","target":"_blank","label":"Legal Disclosure"},{"url":"https://sap.com/about/legal/copyright.html","title":"View the Copyright Information","target":"_blank","label":"Copyright"},{"url":"https://sap.com/about/legal/trademark.html","title":"View the Trademark Information","target":"_blank","label":"Trademark"},{"url":"https://pages.community.sap.com/resources/moderation","title":"View the support contact channels for SAP","target":"_blank","label":"Support"}]" social-links="[{"tooltip":"Visit the Services and Support from SAP Facebook page","target":"_blank","rel":"noopener noreferrer","name":"facebook","url":"https://www.facebook.com/sapcommunity","iconName":"Facebook"},{"tooltip":"Follow SAP Community on Bluesky","target":"_blank","rel":"noopener noreferrer","name":"bluesky","url":"https://bsky.app/profile/sapcommunity.bsky.social","iconName":"Bluesky"},{"tooltip":"Subscribe to Services and Support from SAP","target":"_blank","rel":"noopener noreferrer","name":"youtube","url":"https://www.youtube.com/@SAPCommunity","iconName":"Youtube"},{"tooltip":"Follow SAP Support Help","target":"_blank","rel":"noopener noreferrer","name":"linkedin","url":"https://www.linkedin.com/showcase/sap-developers","iconName":"LinkedIn"}]" is-show-cookie-preferences="true" is-light-theme="true" mode="light"></ds-footer></div></div><script id="__NEXT_DATA__" type="application/json" crossorigin="">{"props":{"pageProps":{"topicPage":{"uid":"bltddcb1b9a0f42a3f1","_version":4,"locale":"en-us","ACL":{},"_in_progress":false,"additional_supported_languages":[],"associated_tags":[{"tag_id":"ed5c1ef6-932f-4c19-b2ba-1be375109ff5"}],"create_a_post_url":"https://community.sap.com/t5/forums/postpage/board-id/technology-questions/interaction-style/qanda","created_at":"2021-11-27T06:31:23.948Z","created_by":"blt30ad6f9a3bc9b84e","description":"Improve the efficiency of your development teams and ensure consistency across your SAP apps by using standard page types to build applications. Using SAP Fiori elements to build apps that rely on SAP data can save you time and money on both development and maintenance costs. SAP Fiori elements is a library of several common floorplans that gives you a head start on developing applications that connect to data in SAP back-end systems.","disable_ask_a_question_and_write_a_blog_post_links":false,"follow_url":"https://community.sap.com/t5/technology/ct-p/technology","meta_information":{"title":"SAP Fiori Elements | SAP Community","description":"Join the community to ask questions, share tips, and find resources on streamlining the app building experience for developers using SAP Fiori elements.","keywords":"sap fiori elements, fiori elements, sap fe, fe"},"related_topics":[],"tags":[],"title":"SAP Fiori elements","topic_area":[{"_content_type_uid":"topic_area","uid":"blt39709a547a0b98d9","title":"Products – Technology Platform","tags":[],"locale":"en-us","ACL":{},"created_by":"blt30ad6f9a3bc9b84e","updated_by":"blt30ad6f9a3bc9b84e","created_at":"2021-11-27T06:32:29.576Z","updated_at":"2021-11-27T06:32:29.576Z","_version":1,"_in_progress":false,"publish_details":{"time":"2024-01-03T08:17:23.611Z","user":"blt1c10d1922c65791d","environment":"blt42929281d32da47c","locale":"en-us"}}],"topic_page_content":[{"_content_type_uid":"topic_page_admin_content","uid":"bltdc92272ca182957f","_version":46,"locale":"en-us","ACL":{},"_in_progress":false,"announcements":{"announcements":[]},"block_components":[{"expert_content":{"title":"SAP Fiori elements on the SAP Community","_metadata":{"uid":"cs3e532f88bc9c133b"},"image":{"_version":1,"is_dir":false,"uid":"bltd2cec5a5ddf00594","ACL":{},"content_type":"image/png","created_at":"2021-11-27T06:26:18.621Z","created_by":"blt30ad6f9a3bc9b84e","file_size":"125337","filename":"logo_k4u_ohnetypo.png","parent_uid":"bltd829eb2709c5d8e7","tags":[],"title":"logo_k4u_ohnetypo.png","updated_at":"2021-11-27T06:26:18.621Z","updated_by":"blt30ad6f9a3bc9b84e","publish_details":{"environment":"blt42929281d32da47c","locale":"en-us","time":"2023-12-29T14:45:02.370Z","user":"blt274918ecf2e18049"},"url":"https://eu-images.contentstack.com/v3/assets/blt367615c96ba8c07d/bltd2cec5a5ddf00594/61a1cf8a1d40355b7c8e6917/logo_k4u_ohnetypo.png"},"description":"\u003cp\u003eVisit the \u003ca href=\"https://blogs.sap.com/tags/ed5c1ef6-932f-4c19-b2ba-1be375109ff5/\"\u003eSAP Community blogs for SAP Fiori elements\u003c/a\u003e to keep up to date with new features and more.\u003c/p\u003e\u003ca href=\"https://roadmaps.sap.com/board?PRODUCT=000D3AAADBCE1EEBA3CA43CF76074694\u0026range=2021Q2-2022Q1#Q3%202021\" target=\"_blank\" rel=\"noopener noreferrer\"\u003eSee the latest roadmap for SAP Fiori elements\u003c/a\u003e"}},{"expert_content":{"title":"Get Help","_metadata":{"uid":"csfa7f7736842b12ef"},"image":{"_version":1,"is_dir":false,"uid":"bltc2a2754b4a07b51d","ACL":{},"content_type":"image/svg+xml","created_at":"2021-11-27T06:26:29.255Z","created_by":"blt30ad6f9a3bc9b84e","file_size":"2220","filename":"281738-pictogram-blue.svg","parent_uid":"bltd829eb2709c5d8e7","tags":[],"title":"281738-pictogram-blue.svg","updated_at":"2021-11-27T06:26:29.255Z","updated_by":"blt30ad6f9a3bc9b84e","publish_details":{"environment":"blt42929281d32da47c","locale":"en-us","time":"2023-12-29T14:48:22.142Z","user":"blt274918ecf2e18049"},"url":"https://eu-images.contentstack.com/v3/assets/blt367615c96ba8c07d/bltc2a2754b4a07b51d/61a1cf9594682f3b21776a20/281738-pictogram-blue.svg"},"description":"\u003cp\u003eNeed additional assistance? Visit the SAP Fiori Help Portal for compatibility, functionality, and application development assistance.\u003cbr /\u003eNote: Please use component CA-UI5-ST (OData V2)\u0026nbsp;or CA-UI5-FE (OData V4)\u0026nbsp;to file an incident with the SAP Fiori elements team. We will be in touch as soon as possible.\u003c/p\u003e\u003ca href=\"https://sapui5.hana.ondemand.com/#/topic/03265b0408e2432c9571d6b3feb6b1fd\" target=\"_blank\" rel=\"noopener noreferrer\"\u003eVisit the SAP Fiori elements documentation\u003c/a\u003e\u003cbr /\u003e\u003ca href=\"https://www.sap.com/cmp/nl/sap-fiori-development-newsletter/index.html\" target=\"_blank\" rel=\"noopener noreferrer\"\u003eSubscribe to the SAP Fiori development newsletter\u003c/a\u003e\u003cbr /\u003e\u003ca href=\"https://community.sap.com/t5/enterprise-resource-planning-blogs-by-sap/sap-fiori-development-newsletter-may-2024-issue-28/ba-p/13702765\" target=\"_blank\" rel=\"noopener noreferrer\"\u003eRead the latest issue of the SAP Fiori development newsletter (May2024)\u003c/a\u003e \u003cbr /\u003e\u003cbr /\u003e"}},{"expert_content":{"title":"Getting Started","_metadata":{"uid":"csd498c3836302cace"},"image":{"_version":1,"is_dir":false,"uid":"bltd5a8b08ba735aa3c","ACL":{},"content_type":"image/png","created_at":"2021-11-27T06:23:52.453Z","created_by":"blt30ad6f9a3bc9b84e","file_size":"5942","filename":"281091.png","parent_uid":"bltd829eb2709c5d8e7","tags":[],"title":"281091.png","updated_at":"2021-11-27T06:23:52.453Z","updated_by":"blt30ad6f9a3bc9b84e","publish_details":{"environment":"blt42929281d32da47c","locale":"en-us","time":"2023-12-29T14:44:26.325Z","user":"blt274918ecf2e18049"},"url":"https://eu-images.contentstack.com/v3/assets/blt367615c96ba8c07d/bltd5a8b08ba735aa3c/61a1cef81d40355b7c8e690b/281091.png"},"description":"\u003ca href=\"https://learning.sap.com/courses/developing-and-extending-sap-fiori-elements-apps\" target=\"_blank\" rel=\"noopener noreferrer\"\u003eSAP Learning course: Developing and Extending SAP Fiori Elements Apps\u003c/a\u003e\u003cbr /\u003e\u003ca href=\"https://www.youtube.com/playlist?list=PLo17W6sWsxWP4RMYXd7l824ss5KriAbwm\" target=\"_blank\" rel=\"noopener noreferrer\"\u003eGetting started with SAP Fiori elements video series\u003c/a\u003e\u003cbr /\u003e\u003ca href=\"https://d.dam.sap.com/a/7JMn4gA\" target=\"_blank\" rel=\"noopener noreferrer\"\u003eRead the SAP Fiori elements expert paper\u003c/a\u003e\u003cbr /\u003e\u003ca href=\"https://sapui5.hana.ondemand.com/#/topic/62d3f7c2a9424864921184fd6c7002eb\" target=\"_blank\" rel=\"noopener noreferrer\"\u003eSAP Fiori elements feature map\u003c/a\u003e\u003cp\u003e\u003ca href=\"https://www.youtube.com/playlist?list=PLo17W6sWsxWM0yervb4VUxglVAop34_DQ\" target=\"_self\"\u003eIntroduction to the flexible programming model video series (OData V4)\u003c/a\u003e\u003c/p\u003e\u003cp\u003e\u003ca href=\"https://sapui5.hana.ondemand.com/test-resources/sap/fe/core/fpmExplorer/index.html#/overview/introduction\" target=\"_self\"\u003eSAP Fiori elements flexible programming model explorer (OData V4)\u003c/a\u003e\u003ca href=\"https://experience.sap.com/fiori-design-web/smart-templates/#\" target=\"_self\"\u003e\u003cbr /\u003eDesign guidelines for SAP Fiori elements\u003c/a\u003e\u003cbr /\u003e\u003c/p\u003e"}},{"expert_content":{"title":"Events","_metadata":{"uid":"csa172cc54569fb0ab"},"image":{"_version":1,"is_dir":false,"uid":"blt4c969072e7bf2b7b","ACL":{},"content_type":"image/png","created_at":"2021-11-27T06:22:19.775Z","created_by":"blt30ad6f9a3bc9b84e","file_size":"12878","filename":"283063_Media_center_R_blue.png","parent_uid":"bltd829eb2709c5d8e7","tags":[],"title":"283063_Media_center_R_blue.png","updated_at":"2021-11-27T06:22:19.775Z","updated_by":"blt30ad6f9a3bc9b84e","publish_details":{"environment":"blt42929281d32da47c","locale":"en-us","time":"2023-12-29T14:48:17.193Z","user":"blt274918ecf2e18049"},"url":"https://eu-images.contentstack.com/v3/assets/blt367615c96ba8c07d/blt4c969072e7bf2b7b/61a1ce9bfd44a740545b59d6/283063_Media_center_R_blue.png"},"description":"\u003cp\u003e\u003ca href=\"https://events.sap.com/noam/sap-fiori-innovation-day-chicago-2024/en/home\" target=\"_self\"\u003eSAP Fiori Innovation Day\u003c/a\u003e (Chicago, August 13, 2024)\u003c/p\u003e\u003cp\u003e\u003ca href=\"https://github.com/SAP-samples/teched2023-DT262\" target=\"_self\"\u003eBoost your productivity in developing SAPUI5 apps with SAP Fiori tools (SAP TechEd 2023 session DT262)\u003c/a\u003e\u003c/p\u003e\u003cp\u003e\u003ca href=\"https://go3.events.sap.com/sapteched/hybrid/2022/reg/flow/sap/saptech2022/sapteched2022catalog/page/catalog/session/1661198037900001EyoI\" target=\"_self\"\u003eBoost Your Productivity in Developing SAP Fiori Apps (SAP TechEd 2022 hands-on session DT181)\u003c/a\u003e\u003c/p\u003e\u003cp\u003e\u003ca href=\"https://youtu.be/cFv_pkVcB4Y\" target=\"_self\"\u003eUI5con 2022 keynote on what's new in SAP Fiori elements and SAP Fiori tools\u003c/a\u003e\u003c/p\u003e\u003cp\u003e\u003ca href=\"https://reg.sapevents.sap.com/flow/sap/sapteched2021/portal/page/sessions/session/16303673724730013AoR\" target=\"_self\"\u003eBuild timeless and low-maintenance SAP Fiori apps faster than ever (SAP TechEd 2021 lecture session\u0026nbsp;IIS108)\u003c/a\u003e\u003c/p\u003e\u003cp\u003e\u003ca href=\"https://reg.sapevents.sap.com/flow/sap/sapteched2021/portal/page/sessions/session/163036737298900134yv\" target=\"_self\"\u003eAccelerate the development of SAP Fiori apps using SAP Fiori elements (SAP TechEd 2021 hands-on session IIS160)\u003c/a\u003e\u003c/p\u003e\u003cbr /\u003e"}}],"block_components_title":"Expert Content","created_at":"2021-11-27T06:30:21.774Z","created_by":"blt30ad6f9a3bc9b84e","featured_content":[{"title":"Read how to build SAP Fiori apps at scale","_metadata":{"uid":"cs8106db954224bb37"},"image":{"_version":1,"is_dir":false,"uid":"bltfc04023f7867798f","ACL":{},"content_type":"image/jpeg","created_at":"2021-11-27T06:24:17.815Z","created_by":"blt30ad6f9a3bc9b84e","description":"","file_size":"16325984","filename":"282961_GettyImages-697538579.jpg","parent_uid":"blt496c37ecd51f3760","tags":["3840x560:6720:980:x0:y2205","1920x340:6720:1190:x0:y2219","980x260:6720:1783:x0:y1834","https://preview.api.community.sap.com/assets","230x150:6720:4383:x0:y44","1240x340:6720:1843:x0:y1743"],"title":"282961_GettyImages-697538579.jpg","updated_at":"2021-11-27T06:24:17.815Z","updated_by":"blt30ad6f9a3bc9b84e","publish_details":{"environment":"blt42929281d32da47c","locale":"en-us","time":"2023-12-29T14:44:20.185Z","user":"blt274918ecf2e18049"},"url":"https://eu-images.contentstack.com/v3/assets/blt367615c96ba8c07d/bltfc04023f7867798f/61a1cf11d42af57e66e189b4/282961_GettyImages-697538579.jpg"},"description":"\u003cp\u003e\u003c/p\u003e\u003cp\u003eRead our expert paper about using SAP Fiori elements and SAP Fiori tools to improve developer productivity while delivering a consistent user experience in enterprise-scale apps.\u003c/p\u003e\u003ca href=\"https://www.sap.com/documents/2021/05/fce40d55-e37d-0010-bca6-c68f7e60039b.html\" target=\"_blank\" rel=\"noopener noreferrer\"\u003eDownload the paper\u003c/a\u003e\u003cp\u003e\u003c/p\u003e"},{"title":"Attend a free course on SAP Fiori elements","_metadata":{"uid":"csba7a7bae1707d334"},"image":{"_version":1,"is_dir":false,"uid":"blt1f9865a59bea5ae0","ACL":{},"content_type":"image/jpeg","created_at":"2021-11-27T06:14:45.360Z","created_by":"blt30ad6f9a3bc9b84e","file_size":"37067","filename":"287641_GettyImages-508251602_small.jpg","parent_uid":"blt369661023da62c2f","tags":[],"title":"287641_GettyImages-508251602_small.jpg","updated_at":"2021-11-27T06:14:45.360Z","updated_by":"blt30ad6f9a3bc9b84e","publish_details":{"environment":"blt42929281d32da47c","locale":"en-us","time":"2023-12-29T14:49:59.611Z","user":"blt274918ecf2e18049"},"url":"https://eu-images.contentstack.com/v3/assets/blt367615c96ba8c07d/blt1f9865a59bea5ae0/61a1ccd52117455cff7ba4c4/287641_GettyImages-508251602_small.jpg"},"description":"\u003cp\u003eLearn how to build SAP Fiori apps using the same technologies and tools that SAP uses for SAP Fiori app development for SAP S/4HANA: SAP Fiori elements and\u0026nbsp;SAP Fiori tools.\u003c/p\u003e\u003cp\u003e\u003ca href=\"https://learning.sap.com/courses/developing-and-extending-sap-fiori-elements-apps\" target=\"_self\"\u003eView the course\u003c/a\u003e\u003c/p\u003e"},{"title":"Watch the Using SAP Fiori elements video series","_metadata":{"uid":"csd3fe6ba9e4614fa7"},"image":{"_version":1,"is_dir":false,"uid":"blt5e2ffec936898b21","ACL":{},"content_type":"image/jpeg","created_at":"2021-11-27T06:24:13.833Z","created_by":"blt30ad6f9a3bc9b84e","file_size":"15530859","filename":"284037_GettyImages-769719673.jpg","parent_uid":"blt369661023da62c2f","tags":[],"title":"284037_GettyImages-769719673.jpg","updated_at":"2021-11-27T06:24:13.833Z","updated_by":"blt30ad6f9a3bc9b84e","publish_details":{"environment":"blt42929281d32da47c","locale":"en-us","time":"2023-12-29T14:44:06.354Z","user":"blt274918ecf2e18049"},"url":"https://eu-images.contentstack.com/v3/assets/blt367615c96ba8c07d/blt5e2ffec936898b21/61a1cf0d0843d86168390217/284037_GettyImages-769719673.jpg"},"description":"\u003cp\u003e\u003c/p\u003e\n\u003cp\u003eThis video series features developers explaining how they use SAP Fiori elements to build their apps and how it saves them time and delivers a consistent user experience every time.\u003c/p\u003e\u003ca href=\"https://www.youtube.com/playlist?list=PLo17W6sWsxWOqcFs38y6EjjBaS3eIFLCP\" target=\"_blank\" rel=\"noopener noreferrer\"\u003eWatch the videos\u003c/a\u003e\n\u003cp\u003e\u003c/p\u003e"},{"title":"Learn about the different floorplans that SAP Fiori elements supports","_metadata":{"uid":"cs2b9cf6b5fec8f181"},"image":{"_version":1,"is_dir":false,"uid":"blt9b7bfa6631913c4f","ACL":{},"content_type":"image/jpeg","created_at":"2021-11-27T06:24:13.909Z","created_by":"blt30ad6f9a3bc9b84e","file_size":"14180020","filename":"276440_276440_h_ergb_s_gl.jpg","parent_uid":"blt369661023da62c2f","tags":[],"title":"276440_276440_h_ergb_s_gl.jpg","updated_at":"2021-11-27T06:24:13.909Z","updated_by":"blt30ad6f9a3bc9b84e","publish_details":{"environment":"blt42929281d32da47c","locale":"en-us","time":"2023-12-29T14:44:06.322Z","user":"blt274918ecf2e18049"},"url":"https://eu-images.contentstack.com/v3/assets/blt367615c96ba8c07d/blt9b7bfa6631913c4f/61a1cf0d1d40355b7c8e690f/276440_276440_h_ergb_s_gl.jpg"},"description":"\u003cp\u003eSAP Fiori elements has different floorplans to suit most business scenarios: • Overview page • List report • Object page • Analytical list report • Worklist\u003c/p\u003e\u003ca href=\"https://experience.sap.com/fiori-design-web/smart-templates/\" rel=\"noopener noreferrer\"\u003eLearn about floorplans\u003c/a\u003e"},{"title":"Read how SAP Fiori elements streamlines SAPUI5 development","_metadata":{"uid":"csb0a77f338620c4e2"},"image":{"_version":1,"is_dir":false,"uid":"bltfc04023f7867798f","ACL":{},"content_type":"image/jpeg","created_at":"2021-11-27T06:24:17.815Z","created_by":"blt30ad6f9a3bc9b84e","description":"","file_size":"16325984","filename":"282961_GettyImages-697538579.jpg","parent_uid":"blt496c37ecd51f3760","tags":["3840x560:6720:980:x0:y2205","1920x340:6720:1190:x0:y2219","980x260:6720:1783:x0:y1834","https://preview.api.community.sap.com/assets","230x150:6720:4383:x0:y44","1240x340:6720:1843:x0:y1743"],"title":"282961_GettyImages-697538579.jpg","updated_at":"2021-11-27T06:24:17.815Z","updated_by":"blt30ad6f9a3bc9b84e","publish_details":{"environment":"blt42929281d32da47c","locale":"en-us","time":"2023-12-29T14:44:20.185Z","user":"blt274918ecf2e18049"},"url":"https://eu-images.contentstack.com/v3/assets/blt367615c96ba8c07d/bltfc04023f7867798f/61a1cf11d42af57e66e189b4/282961_GettyImages-697538579.jpg"},"description":"\u003cp\u003eSAP Fiori elements generates SAP Fiori apps at runtime from existing OData services. It uses annotations to define attributes and relationships among your data. It is built on top of SAPUI5, SAP’s HTML5 development toolkit.\u003c/p\u003e\u003ca href=\"https://sapui5.hana.ondemand.com/#/topic/03265b0408e2432c9571d6b3feb6b1fd\" target=\"_blank\" rel=\"noopener noreferrer\"\u003eRead the documentation\u003c/a\u003e"},{"title":"Leverage the flexible programming model using OData V4","_metadata":{"uid":"cs697b5752f85a8cb1"},"image":{"_version":1,"is_dir":false,"uid":"bltef161109bf1aefe3","ACL":{},"content_type":"image/jpeg","created_at":"2021-11-27T06:14:33.050Z","created_by":"blt30ad6f9a3bc9b84e","file_size":"13523602","filename":"276402_276402_h_ergb_s_gl.jpg","parent_uid":"blt369661023da62c2f","tags":[],"title":"276402_276402_h_ergb_s_gl.jpg","updated_at":"2021-11-27T06:14:33.050Z","updated_by":"blt30ad6f9a3bc9b84e","publish_details":{"environment":"blt42929281d32da47c","locale":"en-us","time":"2023-12-29T14:44:39.163Z","user":"blt274918ecf2e18049"},"url":"https://eu-images.contentstack.com/v3/assets/blt367615c96ba8c07d/bltef161109bf1aefe3/61a1ccc9b6b946516b63979c/276402_276402_h_ergb_s_gl.jpg"},"description":"\u003cp\u003eThe flexible programming model makes it easy to extend apps based on SAP Fiori elements for OData V4. Using building blocks lets you adapt your apps with a minimal amount of custom SAPUI5 coding. \u003c/p\u003e\n\u003cp\u003e\u003ca href=\"https://blogs.sap.com/2021/08/19/leverage-the-flexible-programming-model-to-extend-your-sap-fiori-elements-apps-for-odata-v4/\"\u003eRead about the flexible programming model\u003c/a\u003e\u003c/p\u003e"}],"link_lists":[{"title":"Related Resources","_metadata":{"uid":"cs2c7bf56314f837b5"},"links":[{"title":"SAP Help Portal for SAP Fiori elements","_metadata":{"uid":"csccfb23d4e9eb4586"},"href":"https://sapui5.hana.ondemand.com/#/topic/03265b0408e2432c9571d6b3feb6b1fd"},{"title":"\"Developing and Extending SAP Fiori Elements Apps\" SAP Learning course","_metadata":{"uid":"cs9e5de21f044296d6"},"href":"https://learning.sap.com/courses/developing-and-extending-sap-fiori-elements-apps"},{"title":"Getting started with SAP Fiori elements video series","_metadata":{"uid":"csa80db6e96135f52e"},"href":"https://www.youtube.com/playlist?list=PLo17W6sWsxWP4RMYXd7l824ss5KriAbwm"},{"title":"SAP online track video on SAP Fiori elements","_metadata":{"uid":"cs411a2cc3c6289147"},"href":"https://youtu.be/8A3gVJLgbbg"},{"title":"SAP Fiori elements Flexible Programming Model explorer","_metadata":{"uid":"cs676ecfda0bafa9e1"},"href":"https://sapui5.hana.ondemand.com/test-resources/sap/fe/core/fpmExplorer/index.html"}]},{"title":"Related community topics","_metadata":{"uid":"cs20c357af16d39982"},"links":[{"title":"SAP Fiori tools","_metadata":{"uid":"cs2cecbca6f1acdb76"},"href":"https://community.sap.com/topics/fiori-tools"},{"title":"SAP Fiori","_metadata":{"uid":"cse348ef5e66bf0529"},"href":"https://community.sap.com/topics/fiori"},{"title":"SAPUI5","_metadata":{"uid":"cs847d2c148e20a2e8"},"href":"https://community.sap.com/topics/ui5"},{"title":"SAP Business Application Studio","_metadata":{"uid":"csf9026d52e8f5782c"},"href":"https://community.sap.com/topics/business-application-studio"},{"title":"SAP Cloud Application Programming Model (CAP)","_metadata":{"uid":"csedebb5413d040e27"},"href":"https://community.sap.com/topics/cloud-application-programming"},{"title":"SAP ABAP Development (includes RAP)","_metadata":{"uid":"cscd051adeebb87332"},"href":"https://community.sap.com/topics/abap"},{"title":"Share with Microsoft Teams","_metadata":{"uid":"cs5bc77afd1035ad19"},"href":"https://pages.community.sap.com/topics/s4hana-ms-teams"}]},{"title":"Related blog posts","_metadata":{"uid":"csa6e51e07cba0406f"},"links":[{"title":"Latest SAP Fiori tools adds more low-code capabilities","_metadata":{"uid":"cs57525e3c030b2086"},"href":"https://blogs.sap.com/2022/11/02/sap-fiori-tools-2211-update-includes-typescript-support-easier-troubleshooting-flexible-programming-model-support-and-more/"},{"title":"SAP Fiori elements roadmap update","_metadata":{"uid":"cs0c779ce365c7f9b3"},"href":"https://roadmaps.sap.com/board?q=sapui5\u0026range=2023Q1-2024Q4#Q1%202023"},{"title":"SAP Fiori elements now supports OData V4","_metadata":{"uid":"cs43366303d9dd3283"},"href":"https://blogs.sap.com/2020/11/27/sap-fiori-elements-now-support-odata-v4/"},{"title":"Flexible Programming Model simplifies adding custom code","_metadata":{"uid":"cs73ac0835d5254ebe"},"href":"https://blogs.sap.com/2022/12/08/video-series-on-flexible-programming-model-for-sap-fiori-elements/"},{"title":"SAP Fiori tools release announcement and overview","_metadata":{"uid":"csfd3b7a5b37c672d3"},"href":"https://blogs.sap.com/2020/06/22/sap-fiori-tools-is-generally-available.-increase-the-efficiency-of-developing-sap-fiori-elements-apps/"},{"title":"Yorkshire Water uses SAP Fiori elements to build Fiori apps quickly","_metadata":{"uid":"cs81a71735fd93d24a"},"href":"https://blogs.sap.com/2020/01/17/yorkshire-water-uses-sap-fiori-elements-to-build-fiori-apps-quickly/"},{"title":"Linde uses SAP Fiori elements to reduce pressure on their development pipeline","_metadata":{"uid":"cs679dede902d966dc"},"href":"https://blogs.sap.com/2019/11/20/linde-uses-sap-fiori-elements-to-reduce-pressure-on-their-development-pipeline/"},{"title":"Feature matrix on ABAP backend support","_metadata":{"uid":"cs77f8da5184b253ef"},"href":"https://blogs.sap.com/2021/07/12/compact-feature-availability-matrix-of-abap-programming-models/"}]},{"title":"Developer Documentation","_metadata":{"uid":"cs8afb41bea8cb2009"},"links":[{"title":"Introduction","_metadata":{"uid":"csb947c9f54a8b4e4a"},"href":"https://sapui5.hana.ondemand.com/#/topic/03265b0408e2432c9571d6b3feb6b1fd"},{"title":"Overview page","_metadata":{"uid":"csec109c9c251ccc99"},"href":"https://sapui5.hana.ondemand.com/#/topic/c64ef8c6c65d4effbfd512e9c9aa5044"},{"title":"List report page","_metadata":{"uid":"cs521e4de9b1d27003"},"href":"https://sapui5.hana.ondemand.com/#/topic/1cf5c7f5b81c4cb3ba98fd14314d4504"},{"title":"Object page","_metadata":{"uid":"cs3f44794b49112f1a"},"href":"https://sapui5.hana.ondemand.com/#/topic/645e27ae85d54c8cbc3f6722184a24a1"},{"title":"Analytical list report page","_metadata":{"uid":"cs1f8881c0fdff6050"},"href":"https://sapui5.hana.ondemand.com/#/topic/3d33684b08ca4490b26a844b6ce19b83"},{"title":"Worklist page","_metadata":{"uid":"cs385ace7a6f7e4038"},"href":"https://sapui5.hana.ondemand.com/#/topic/d1d588f1061b4bac96a1facb80d3f3a2"},{"title":"help.sap.com for SAP Fiori elements","_metadata":{"uid":"cs8ce9144505cef2d3"},"href":"https://help.sap.com/viewer/468a97775123488ab3345a0c48cadd8f/201809.000/en-US/03265b0408e2432c9571d6b3feb6b1fd.html"}]}],"social_media_links":{"facebook_link":"","twitter_link":"","youtube_link":"","linkedin_link":"","instagram_link":""},"tags":[],"title":"SAP Fiori elements","upcoming_events":[],"updated_at":"2024-07-08T21:15:33.217Z","updated_by":"blt4bf918cd6df5da40","publish_details":{"time":"2024-07-08T21:15:45.550Z","user":"blt4bf918cd6df5da40","environment":"blt42929281d32da47c","locale":"en-us"}}],"updated_at":"2024-01-09T10:07:29.179Z","updated_by":"blt1c10d1922c65791d","url":"/topics/fiori-elements","publish_details":{"time":"2024-01-09T10:07:33.278Z","user":"blt1c10d1922c65791d","environment":"blt42929281d32da47c","locale":"en-us"}},"navigation":{"uid":"bltddcb1b9a0f42a3f1","title":"SAP Fiori elements","url":"/topics/fiori-elements","locale":"en-us","parentId":null,"children":[{"uid":"bltf0a139a7c280fe60","title":"SAP Fiori Elements FAQ","url":"/topics/fiori-elements/faq","locale":"en-us","parentId":"bltddcb1b9a0f42a3f1en-us","children":[]}]}},"__N_SSG":true},"page":"/topics/[title]","query":{"title":"fiori-elements"},"buildId":"3752","isFallback":false,"gsp":true,"locale":"en-us","locales":["en-us","zh"],"defaultLocale":"en-us","scriptLoader":[]}</script></body></html>