What are Foundations?

Foundations in Design Systems refer to the core set of principles, guidelines, and assets that form the building blocks of a cohesive and consistent user interface. These elements typically include fundamental parts such as color, typography, spacing, layout and icons, which are standardized to ensure a unified look and feel across a product. Foundations provide a common language and framework for designers and developers, enabling them to work more efficiently and maintain a high level of Quality and consistency throughout the user experience.

How to use Foundations in Design Systems?

For example, Uber Base Design System uses foundations to ensure a consistent and scalable framework across all its applications and services. The system defines foundational elements such as color schemes, typography scales, and spacing guidelines that are applied universally throughout its interfaces. The color scheme includes predefined colors for primary actions, backgrounds, and states, ensuring visual consistency and accessibility across all Uber platforms. The typography scale specifies font sizes and line heights to maintain readability and hierarchy, while the spacing guidelines provide consistent margins and padding to create balanced and visually appealing layouts.