What is Morgan Stanley's primary brand color?

Morgan Stanley does not have a chromatic brand voltage in the conventional sense. The dominant color across the captured page is pure black (#000000) at 503 occurrences — used as text (251), border (251), and one background. The only chromatic color is steel blue (#187aba), appearing 210 times split equally between text (103) and border (105) roles. This is the interactive layer: link underlines, hover-state borders, and focus rings. There is no CTA fill in blue — the primary button is charcoal (#333333) with white text, a rectangular block with 0px radius and no chromatic brand signal.

What typefaces does Morgan Stanley use, and what are good substitutes?

Morgan Stanley runs two proprietary typefaces in strict division. MS Gloriola II Std (in three weights: stdregular, std_semibold, stdlight) handles every heading — display at 40-54px, section sub-heads at 20px — in weight 400-500 with tight negative tracking down to -1.45px. Karla (in bold and regular variants) handles all navigation labels, CTA text, body copy, and the uppercase-tracked 12-14px link labels (Karla Bold at 0.24px and 1.1px tracking). The two-family split maps exactly to a content-voice vs. navigation-voice division. For MS Gloriola II Std, the closest open-source alternative is Playfair Display at the same weight for display headings; for Karla, the typeface is freely available on Google Fonts.

What is Morgan Stanley's corner-radius approach?

Morgan Stanley uses 0px border-radius on virtually every surface — buttons, navigation items, cards, dropdown menus, and most form elements all render as sharp rectangles. The only detected non-zero radius in the extracted data is 10px on the newsletter email subscription input field. This makes Morgan Stanley one of the most geometrically strict systems in the financial category — Morgan Stanley and Fidelity both reach for zero rounding while Barclays uses 99px pill buttons. The square geometry reads as institutional authority: nothing is softened.

Why does Morgan Stanley use a semi-serif display font for headings when most banks use sans?

MS Gloriola II Std is a contemporary semi-serif — it has the proportions of a humanist sans but with subtle serifs on certain strokes, positioning it between a full editorial serif (like the Financial Times' Financier) and a geometric sans. The choice signals print-publication credibility rather than tech-product clarity. Goldman Sachs uses a bold italic sans for headlines; JPMorgan uses a conventional geometric sans at high weight. Morgan Stanley's semi-serif at weight 500 (not 700) reads closer to the Financial Times or Wall Street Journal house style, which is exactly the authority positioning the brand wants — investment ideas, not retail banking. The font is proprietary and not available for download.

What role does the steel blue (#187aba) play, and when should I use it?

Steel blue (#187aba) is the system's sole chromatic layer. Its 210 occurrences split almost evenly between text (103) and border (105), with only 2 background uses — which means it is almost exclusively a typography and border signal, never a fill. Use it for link text, focus-state borders, active-state borders on navigation items, and inline hyperlinks. Do not use it as a button background fill or a card surface — that usage is absent from the captured page and would be inconsistent with the system's flat-ink discipline. The blue is close to the Pantone 300-range steel blue used by many financial institutions, though Morgan Stanley's specific hex sits at medium lightness (OKLCH L≈0.56) rather than the deeper navy that Goldman and JPMorgan use.

Morgan Stanley Design System

Morgan Stanley's marketing-site design system as DESIGN.md.

About Morgan Stanley DESIGN.md

Curated by Dov AzencotUpdated May 19, 2026Source morganstanley.com

Banking & Payments
Fintech & Crypto

Morgan Stanley's marketing site announces authority through absence. No gradient hero, no photography overlay with a glowing CTA pill — the above-fold is a full-bleed documentary image (a globe rendered in blue light) with the wordmark set in white Karla Bold at 12px uppercase in the top-left corner, nothing else. The only color decision is the background: black. Below the fold, a white canvas opens and the system's two typefaces take over: MS Gloriola II Std in weight 500 at 40px with tight -1.45px tracking for section headings, and Karla Regular at 16px with no tracking for body copy. Where Goldman Sachs leans on a bold weight-700 sans and JPMorgan Chase uses a conventional blue primary, Morgan Stanley keeps its headings in a semi-serif display family that reads closer to a financial-publication editorial voice than a typical investment-bank marketing system.

The DESIGN.md file captures the system in machine-readable form. Inside: 12 color tokens organized around a pure-ink dominant (503 occurrences), a single steel-blue interactive layer (#187aba, 210 occurrences split equally between text and border roles), and structural mid-grays at #4c4c4c and #333333. Twelve typography tokens span MS Gloriola II Std across three heading sizes and Karla across body, label, nav, and CTA roles — including the uppercase-tracked 12px Karla Bold used on every navigation link and CTA. One radius value (10px on the newsletter input), an 8-step spacing scale, and 16 component definitions cover the hero image band, the sectional display headings, the uppercase-link CTAs, the zero-radius navigation, and the newsletter subscription form.

Feed this file to Claude or Cursor and it reproduces Morgan Stanley's specific discipline: two proprietary typefaces in strict division, near-monochrome palette with a single blue link layer, flat 0px surfaces everywhere except the newsletter email input, and no decorative background fills outside the hero photography band. The system is worth studying not for its visual warmth — it has none — but for how far a brand can lean into typographic voice and ink-to-paper contrast as its sole differentiator. The display font is doing the work that color and gradient do in every competitor's system.

What makes it distinct

Two-typeface splitMS Gloriola II Std owns every heading tier; Karla handles every label, nav item, and CTA in uppercase-tracked sans
Near-monochrome palettepure black (#000000) dominates at 503 occurrences; the only chromatic note is steel blue (#187aba) for links and borders
Zero roundingevery surface including the newsletter input sits at 0px border-radius; the only detected radius is a single 10px on the email field
Uppercase CTA labels at 1.1px trackingKarla Bold at 14px / weight 700 in all-caps is the system's only typographic warmth signal
No shadows, no background fillsdepth comes from a 1px black border and column-level ink contrast alone

Live at morganstanley.com

A snapshot of the brand in production. Hover the frame to scroll the page; click to visit.

morganstanley.com

Explore Morgan Stanley

Pick what you want to see — mockups, colors, typography, layout, or the full component list.

Brand & Accent

Sparing, CTA-only voltage.

Surface

Page and card backgrounds.

Text

Headlines, body, captions, muted.

Borders & Hairlines

Dividers, outlines, structural rules.

Morgan Stanley design system FAQ

Common questions about Morgan Stanley's tokens, components, and how to use this DESIGN.md in your project.

Specs, directories, and component libraries that pair with this design system.

Browse all design systems

The full directory of DESIGN.md files on shadcn.io, with live mockups for each.

Morgan Stanley — official site

Morgan Stanley's public marketing site — the source of truth for the live tokens captured in this file.

The DESIGN.md specification

Google Labs' open spec for machine-readable design system files — the format this page is built on.