The visual foundations of the design system, such as color, typography, illustration, and more, are each adapted for our different uses.

72
align-image-left

Typography

The design system uses SAP’s proprietary font, 72, for all use cases. 72 is designed for ease and accessibility, while creating a look and feel that’s modern and fresh.

Download the font

72
align-image-left

Iconography

Explore the icon sets for all SAP Design System themes. Find everything from grid systems and styling to semantics and use cases for each respective theme.

Learn more

72
align-image-left

Motion Design

Bringing together animation and visual effects to enhance user experience across products.

Learn more

72
align-image-left

Illustration

Illustration helps guide users through their product journey by making complex tasks or concepts more digestable, and adding a layer of personality and emotion.

Learn more

72
align-image-left

All Visuals

All visual foundations Explore all of the visual elements that help build out a dynamic user experience—such as design tokens, theming, color, iconography, typography, motion design, typography, and UX illustrations.

Visual Foundations for Web

Visual Foundations for Android

Visual Foundations for iOS