CatalystFoundations
The shared visual rules behind Catalyst components and interfaces.
Foundations define the colors, typography, spacing, and styling conventions that keep an interface consistent. Components apply these rules; themes supply values for different visual contexts.
Design tokens give recurring design decisions a name, such as a color or spacing value, so they can be reused across tools and code. This follows the terminology of the Design Tokens Community Group.
Explore the foundations
- Styling — Configure Tailwind CSS and apply Catalyst styles.
- Theming — Set up the theme package and work with theme scopes.
- Typography — Use PMI's typeface, font sizes, and weights.
- Design tokens — Understand named values and their roles.
- Icons and logos — Use shared visual assets; browse the Assets folder for the full reference.