Skip to Content
Morningstar Design System
What’s New
Getting Started
Visual Language
Components
Charts
Writing Guidelines
Overview
Charts Overview
About Chart Elements
Chart Examples
Legacy Charts (MBC)
Building With Chart Elements
Design Standards
Visual Language
Making Charts Accessible
Interactions and Behaviors
Color Utility
Elements
Area Plot
Area Plot Stacked
Bar Plot
Bar Plot Horizontal
Bar Plot Horizontal Benchmark
Bar Plot Horizontal Grouped
Bar Plot Horizontal Stacked
Bar Plot Vertical
Bar Plot Vertical Benchmark
Bar Plot Vertical Grouped
Bar Plot Vertical Stacked
Donut Plot
Grid
Guidelines
Histogram Plot
Hover Flag
Layout
Legend
Line Plot
Pointer
Scatter Plot
Scatter Plot Benchmark
Scatter Plot Weighted
X-Axis
Y-Axis
Primitives
Circle
Group
Line
Path
Rectangle
Comparison
Static
Horizontal Bar
Vertical Bar
Grouped Bar
Stacked Bar
Over Time
Few Categories or Periods
Vertical Bar
Grouped Bar
Stacked Bar
Line
Many Categories or Periods
Time-Series Line
(e.g., Performance or Growth)
Composition
Static
Donut
(e.g., Allocation)
Horizontal Bar
(e.g., Long/Short Allocation)
Over Time
Stacked Bar
Relationship & Distribution
Two Variables
Scatter Plot
(e.g., Risk/Reward Analysis)
Three Variables
Bubble
(e.g., Weighted Portfolio Holdings)
Morningstar Brand System
Morningstar Design System
What’s New
Getting Started
Visual Language
Components
Charts
Writing Guidelines
Legacy Docs