Morningstar Design System

Overview

Collaborated with the Credit Ratings team and global business units at Morningstar to design and implement the Morningstar Design System (MDS), a comprehensive, scalable design system to unify user experience (UX) and user interface (UI) across the company’s diverse financial products and platforms.

Key Wins

Unified the Product Ecosystem

Replaced fragmented UI patterns with a shared system of components, guidelines, and interaction models.

  • Consistent UX/UI across multiple platforms
  • Reduced design debt across teams
  • Clear standards for accessibility, spacing, and typography

Accelerated Delivery & Collaboration

Built MDS as a true cross-functional asset—designed for designers, developers, and product owners.

  • Faster design-to-engineering handoff
  • Reusable components that cut build time dramatically
  • Improved predictability and quality in releases

Designed for Scale Across Global Teams

Enabled teams in Chicago, Mumbai, London, and Toronto to ship experiences with the same polish, clarity, and structure.

  • Shared design language and governance
  • Easier onboarding for new designers
  • System patterns adopted across multiple business units

Impact

The Morningstar Design System became the backbone of Morningstar’s enterprise experience—reducing inconsistency, speeding execution, and empowering global teams to deliver higher-quality interfaces at scale.