What is Paramount+'s primary brand color?

Paramount+'s brand voltage is a cobalt-blue gradient running from a deep mid-cobalt #0037c5 on the left to a brighter electric cobalt #0064ff on the right, applied as the fill on the email-capture submit pill. The underlying canvas behind the poster wallpaper is a deep midnight navy #0a1d61. Together these two values define the Paramount-blue temperature the brand has run for years on its parent network identity. The cobalt gradient appears exactly once on the captured landing page; the navy carries the entire below-wallpaper floor. White at 71px in Proxima Nova Black does every other piece of the page's chromatic work.

What typeface does Paramount+ use, and what should I use as a substitute?

The landing page runs Proxima Nova across every tier — Regular for body and disclaimers, SemiBold for the all-caps locale stamp, and Black for the four-line display headline. The display sits at 71px with -2.13px letter-spacing and a 63.9px line-height (tighter than the size, which forces the four broken lines to stack as one slab of type). Body copy is 17px / 23px Regular; the locale label is 15px / 16px SemiBold with 0.4px tracking and uppercase casing. Proxima Nova is a Mark Simonson licensed family; the closest open-source substitutes are Montserrat at the same weights, or Inter Black for the display tier with a slightly looser counter.

Why is the hero a tiled poster wall instead of a single show?

The landing page is acquisition-first, not show-discovery. Netflix and Max lead with a single still because their value proposition is a flagship original; Paramount+'s pitch is the breadth of the CBS, BET, Comedy Central, Nickelodeon, MTV, and Paramount Pictures catalog combined. Tiling forty-plus posters edge-to-edge as a low-opacity wallpaper makes that breadth literally visible above the fold without privileging any single title. The headline 'A MOUNTAIN OF ENTERTAINMENT' labels what the wallpaper already shows. The white text punches through the dimmed poster grid because the navy overlay drops the artwork to around 30 percent luminance.

What corner-radius scale does Paramount+ use?

The radius scale is small and binary. The submit pill uses 6px rounding and the email input uses 10px — that is the entire scale on the captured page. There is no 12 / 16 / 24px tier, no full pill, no zero-radius hard-corner surface either. The two values sit close enough together that the input-plus-button row reads as a single rounded unit even though their radii differ by 4px. The constraint is deliberate; the page has no card decks, no avatar chips, and no rounded image tiles — the only round-cornered objects are the two form elements, so a richer scale would have nothing to land on.

Can I use this DESIGN.md to build my own streaming-acquisition landing page?

Yes — the file is designed to be fed into Claude, Cursor, or any AI tool that reads structured design tokens. The agent will reproduce Paramount+'s specific moves: tiled poster wallpaper as the hero floor, deep midnight navy as the brand ground, Proxima Nova Black at 71px with tight negative tracking for the four-line display, the cobalt gradient submit pill, and the white shadow-elevated email input. You can also reference values directly: every hex, font family, padding value, and radius is a quoted scalar you can paste into Tailwind config or CSS variables. One caveat: the wallpaper-as-hero move only carries weight if your library has visual variety; for a single-product SaaS it would feel scattered rather than abundant.

Paramount+ Design System

Paramount+'s landing-page design system as a DESIGN.md file.

About Paramount+ DESIGN.md

Curated by Dov AzencotUpdated May 18, 2026Source paramountplus.com

Music, Video & Streaming

Paramount+'s landing page treats its content library as the literal wallpaper. Where Netflix opens with a single autoplay still and Disney+ leads with a hero card framed by a navy gradient, Paramount+ tiles forty-plus series posters edge-to-edge as a low-opacity backdrop — Halo, Yellowstone, Top Gun, 1923, La Brea, Teen Wolf, South Park — and punches the headline straight through them in pure white at 71px. The poster wall doesn't sit beside the type; it carries the type. The deep midnight navy that bleeds through the tile gaps is the closest thing the system has to a brand surface, and even that recedes behind the library inventory.

The DESIGN.md file packages the system into a machine-readable spec for React and AI tooling. Inside: 12 color tokens centered on the cobalt-navy gradient voltage and the pure-white text tier; 11 typography tokens running Proxima Nova in three weights (Regular for body, SemiBold for the all-caps locale label, Black for the four-line display) at sizes ranging from 11px legal copy to 71px headlines; a small radius scale (6px on the submit pill, 10px on the email input); and 14 component definitions covering the wallpaper hero, the white-with-shadow email input, the cobalt-gradient submit button, the legal-copy stack, and the centered mountain wordmark.

Feed this file to Claude or Cursor and it reproduces Paramount+'s specific moves: tiled-library wallpaper instead of a single hero still, Proxima Nova Black at 71px with -2.13px tracking for the four-line shouted headline, cobalt-blue gradient CTA as the single chromatic action, and an all-caps SemiBold locale stamp as the only secondary type role. One opinionated framing: this is the inverse of the streaming-marketing default. Most rivals sell one show; Paramount+ sells the catalog — the wallpaper is the pitch, the headline labels it ("A MOUNTAIN OF ENTERTAINMENT"), and the cobalt pill closes the deal.

What makes it distinct

Poster wallpaper herodozens of low-opacity series stills tile edge-to-edge as the page floor, with the headline punched straight through them
Display at 71px Black, body at 17px RegularProxima Nova carries every tier, with a one-step jump from cap-tracked SemiBold labels to massive Black headlines
Cobalt gradient submitthe email-capture pill runs a #0037c5 to #0064ff horizontal gradient, the only saturated chromatic moment on the page
Navy as groundthe canvas behind the poster wall is a deep midnight #0a1d61, not black, anchoring the cobalt-blue brand temperature
Mountain logo as sole chromethe centered Paramount+ wordmark plus mountain mark is the only brand element above the headline

Live at paramountplus.com

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

paramountplus.com

Explore Paramount+

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.

Paramount+ design system FAQ

Common questions about Paramount+'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.

Paramount+ — official site

Paramount+'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.