Style Guides
This style guide showcases the foundational elements that drive visual clarity and usability across the product ecosystem. From color systems and spacing to typography and UI anatomy, each artifact ensures design scalability and brand coherence across platforms.
Explore the Design
Click on each thumbnail below to view a detailed breakdown of UI patterns and style specifications.
Breadcrumbs Anatomy
Breadcrumbs
Header Component Responsize Sizing Medium
Header Component Responsize Sizing XL
Header Component Responsize Sizing
Task Component Responsive Sizing
Task Component Responsive Sizing copy 2
Task Component Responsive Sizing copy
Colors copy 2
Colors Functional Color copy 2
Neutrals and Functional Colors copy
Colors
Colors Natural Grey copy 2
Colors Functional Color
Neutrals and Functional Colors copy 2
Neutrals and Functional Colors
Colors Natural Grey copy
Colors copy
Colors Functional Color copy
Neutrals and Functional Colors copy 4
Neutrals and Functional Colors copy 3
Colors Natural Grey
Containers & Shadows copy
Containers & Shadows
Icons – Promotion
Icons – Promotion copy 2
Icons – Promotion copy
Icons – System copy 2
Icons – System copy 3
Icons – System copy
Toast Loading
Toast Styles
Primary Button copy 2
Primary Button copy 3
Primary Button copy
Primary Button
Secondary Button copy 2
Secondary Button copy 3
Secondary Button copy
Secondary Button
SELECTION CONTROLS
Student Portal Illustrations
Student Portal Illustrations copy
Student Portal Illustrations copy 2
Student Portal Illustrations copy 3
Tags
Task Card States
Text Input copy 2
Text Input copy 3
Text Input copy 4
Text Input copy
Text Input
