What font does CNBC use?

CNBC’s website uses four typefaces: Proxima Nova (headings and body text), served from static-redesign.cnbcfm.com; Lyon, served from static-redesign.cnbcfm.com; Lato, served from static-redesign.cnbcfm.com; Averta, served from static-redesign.cnbcfm.com.

What are CNBC’s brand colours?

The main colours on cnbc.com are Light Midnight Blue (#002F6C), Deep Royal Blue (#005594), Deep Midnight Blue (#071D39), Midnight Blue (#001E5A), Golden Rod (#FCB700) and Light Royal Blue (#0053CF).

What colour is CNBC’s text and background?

Body text is #171717 on a #FFFFFF background.

Where is CNBC’s logo from?

The logo shown in this guide was found on cnbc.com’s homepage. For official logo files and usage rules, check CNBC’s own brand or press page.

Is this CNBC’s official style guide?

No. SiteStyleGuide made it from cnbc.com’s public web pages on 5 November 2026, and isn’t affiliated with CNBC. Members can refresh a guide after 90 days to pick up changes.

Unofficial A style guide made by SiteStyleGuide from cnbc.com’s public web pages. Not affiliated with or endorsed by CNBC. The real site is cnbc.com ↗

Unofficial style guide

CNBCstyle guide

CNBC’s website (cnbc.com) uses Proxima Nova for its headings and body text. Its palette is led by Light Midnight Blue (#002F6C), Deep Royal Blue (#005594) and Deep Midnight Blue (#071D39), with #171717 text on #FFFFFF. Captured from the live site on 5 November 2026.

Website: cnbc.com
Typefaces: Proxima Nova, Lyon, Lato
Palette: 4 neutrals, 12 colours, 3 gradients
Captured: 5 Nov 2026 · added by @sitestyleguide

Save Add to collection Share Report

Screenshot of the cnbc.com homepage on a desktop screen — Screenshot of cnbc.com on a 1440 px desktop screen, 5 Nov 2026.

Screenshot of the cnbc.com homepage on a phone — On a phone, 390 px.

Identity & metadata

What browsers, search engines and social cards show before anyone reaches the page, from the homepage’s <head>.

Title &
description

Page title: Stock Markets, Business News, Financials, Earnings - CNBC; ● 57 / 60 characters
Meta description: CNBC is the world leader in business news and real-time financial market coverage. Find fast, actionable information.; ● 117 / 160 characters
Site name: CNBC
og:title: US Top News and Analysis
og:description: CNBC is the world leader in business news and real-time financial market coverage. Find fast, actionable information.
Language: en

In search results

CNBChttps://www.cnbc.com/

Stock Markets, Business News, Financials, Earnings - CNBC

CNBC is the world leader in business news and real-time financial market coverage. Find fast, actionable information.

When shared

cnbc.com

US Top News and Analysis

CNBC is the world leader in business news and real-time financial market coverage. Find fast, actionable info…

Logo & favicons

Found as: image in the header. SVG, 113 × 36.

Logo

On white

On black

On Light Midnight Blue

Favicons

1 found

256 px · ICO icon

Stock Markets, Business News, Financials, Earnings - CNBC

Light browser tab

Stock Markets, Business News, Financials, Earnings - CNBC

Dark browser tab

Colour

Read from the site’s stylesheets and weighted by where each colour is used. Names are the nearest standard colour name. Click a swatch to copy its hex code.

Contrast is against the site’s text colour (#171717) and white, using WCAG 2 ratios: 4.5 for body text, 3 for large text.

Colour

Balance

How much each colour is used

White 29.5%
Light Midnight Blue 10.6%
Near Black 8.5%
Deep Royal Blue 7.7%
Grey 6.9%
Black 6.7%
Deep Midnight Blue 5.4%
Midnight Blue 4.7%
Golden Rod 4.4%
Light Royal Blue 3.7%
Steel Blue 2.8%
Sea Green 2.8%
Crimson 2.5%
Medium Sea Green 1.6%
Black 1.2%
Dodger Blue 0.9%

By how often each colour appears in the site’s CSS, weighted by where (body, headings, buttons), not by area on the screen.

Neutrals

Text, backgrounds and structure

White

HEX

RGB

HSL

OKLCH

CMYK
0 0 0 0

On text
17.93:1 AAA

On white
—

Text, background, border · .Recommend-endCardWrapper .Recommend-title, .Recommend-titleDark
Near Black

HEX

RGB

HSL

OKLCH

CMYK
0 0 0 91

On text
—

On white
17.93:1 AAA

Text, background, border · .AuthForms-container.AuthForms-forgotPassword .AuthForms-headerTitle, .AuthForms-containerNew.AuthForms-forgotPassword .AuthForms-headerTitle
Grey

HEX

RGB

HSL

OKLCH

CMYK
0 0 0 55

On text
3.84:1 AA large

On white
4.67:1 AA

Text, border, background · .ProgressIndicator-stepTitle, .SearchGroup-itemSubTitle
Black

HEX

RGB

HSL

OKLCH

CMYK
0 0 0 100

On text
1.17:1 Fail

On white
21.00:1 AAA

Text, background, border · .omega_subtitles, .NotificationProvider-notificationsPanelTitle

Colours

Brand colours and accents, most used first

Light Midnight Blue

HEX

RGB

HSL

OKLCH

CMYK
100 56 0 58

On text
1.39:1 Fail

On white
12.94:1 AAA

Text, background, border · .Card-threeUpRectangleSquareMediaDescription .Card-textContent .Card-titleAndFoo, .QuoteFinder-title
Deep Royal Blue

HEX

RGB

HSL

OKLCH

CMYK
100 43 0 42

On text
2.33:1 Fail

On white
7.70:1 AAA

Text, background, border · .nav-menu-mainLinksWrapper:before, .nav-menu-mainLinksWrapper:after
Deep Midnight Blue

HEX

RGB

HSL

OKLCH

CMYK
88 49 0 78

On text
1.06:1 Fail

On white
16.88:1 AAA

Text, background, border · .Card-aboveImageContent, .mega-links-primaryLinkExpanded button
Midnight Blue

HEX

RGB

HSL

OKLCH

CMYK
100 67 0 65

On text
1.14:1 Fail

On white
15.75:1 AAA

Background, text, border · .nav-menu-navMenu, .nav-menu-navMenuSticky
Golden Rod

HEX

RGB

HSL

OKLCH

CMYK
0 27 100 1

On text
10.17:1 AAA

On white
1.76:1 Fail

Text, background, border · .MarketsModule-title:before, .FeaturedVideoHeader-title:before
Light Royal Blue

HEX

RGB

HSL

OKLCH

CMYK
100 60 0 19

On text
2.68:1 Fail

On white
6.69:1 AA

Text, background, border · .NewsAndPeersSideDrawerPeerWatch-peerTableSectionTitle, .AuthForms-containerNew .AuthForms-createAccount button
Steel Blue

HEX

RGB

HSL

OKLCH

CMYK
82 35 0 29

On text
3.74:1 AA large

On white
4.80:1 AA

Text, background, border · .TrendingNow-heading:before, .DisclosureAgreement-checkboxActive
Sea Green

HEX

RGB

HSL

OKLCH

CMYK
100 0 35 48

On text
3.79:1 AA large

On white
4.74:1 AA

Text, background, border · .AreYouSure-proFlow .AreYouSure-primaryButton, .AuthDropdown-container .AuthDropdown-signupButton
Crimson

HEX

RGB

HSL

OKLCH

CMYK
0 79 79 19

On text
3.42:1 AA large

On white
5.24:1 AA

Text, background, border · #jw-cnbc-live-stream-player .jw-text-live:before, .SmallStockQuote-negArrow
Medium Sea Green

HEX

RGB

HSL

OKLCH

CMYK
100 0 48 34

On text
5.75:1 AA

On white
3.12:1 AA large

Background, text, border · .AuthForms-unlockButton, .SignedIn-okayButton
Black

HEX

RGB

HSL

OKLCH

CMYK
100 69 0 90

On text
1.12:1 Fail

On white
20.01:1 AAA

Background, border, text · .nav-menu-navMenuLoggedIn, .nav-menu-navMenuStickyLoggedIn
Dodger Blue

HEX

RGB

HSL

OKLCH

CMYK
98 41 0 0

On text
5.82:1 AA

On white
3.08:1 AA large

Background, text, border · .AudioButton-base, .AudioButton-flyout

Gradients

linear-gradient(180deg,#1e579900 0,#000)
linear-gradient(270deg,#0000,#005594)
linear-gradient(270deg,#005594,#0000)

Dark mode

When the device is set to dark

Cool Off White

#DCE0E4
Black

#000000
Cool Dark Grey

#3E4855
White

#FFFFFF
Steel Blue

#0477C9
Cool Grey

#9A9FA7
Charcoal

#272727
Light Grey

#B2B2B2

Typography

Faces from Google Fonts are shown in the real thing. Others are licensed to the site, so they show in your device’s copy if you have one, or a stand-in if not.

Proxima Nova

Aa 400 Aa 900

Proxima Nova

Served from static-redesign.cnbcfm.com · weights 400, 450, 500, 600, 700, 800, 900 · headings, buttons, body · shown in a stand-in if you don’t have it

Aa 400 Aa 800

Lyon

Served from static-redesign.cnbcfm.com · weights 400, 500, 600, 800 · headings · shown in a stand-in if you don’t have it

Aa 400 Aa 900

Lato

Served from static-redesign.cnbcfm.com · weights 400, 700, 900 · headings, buttons · shown in a stand-in if you don’t have it

Aa 400 Aa 800

Averta

Served from static-redesign.cnbcfm.com · weights 400, 600, 700, 800 · shown in a stand-in if you don’t have it

ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789 ! ? & @ % $ – ’ “ ”

Type scale

From the site’s CSS

Heading 2 24px / 27px weight 900 · uppercase

Stock Markets, Business News, Financials, Earni…

Body — Proxima Nova

CNBC is the world leader in business news and real-time financial market coverage. Find fast, actionable information.

Paragraph calc(2cqi + 6px) / 2 weight 500 · Proxima Nova

CNBC is the world leader in business news and real-time financial market coverage. Find fast, actionable information.

Button 12px / 70px weight 600 · Proxima Nova

Get started

Link 12px / 15px weight 700 · uppercase · Proxima Nova

Sizes in use

Most common across the site

24pxline 32px · 26 rules
20pxline 24px · 33 rules
18pxline 22px · 55 rules
16pxline 1.2 · 79 rules
14pxline 16px · 147 rules
12pxline 12px · 160 rules
11pxline 13px · 37 rules
10pxline 12px · 33 rules

Elements

The main button and link as the site’s CSS draws them, and the corner radii and shadows it uses most.

Elements

Button

Get started

.mega-links-primaryLinkExpanded button · #071D39

Link

Read our latest news today.

a · #FFFFFF

Corner radius

3px · 44×
4px · 28×
2px · 11×
100% · 11×
50% · 10×
5px · 9×

Shadows

0 0 0 0 #ce2b2b
5px 5px 20px #1717171a
0 4px 4px #00000040
0 0 0 0 #fff

Layout

Breakpoints from the site’s media queries and the widths its content is held to, with how often each appears.

Grid

Breakpoints

360

759

760

1019

1020

1180

1339

1340

On a scale of 0 to 1440 px.

Content widths (max-width)

1290 px

1000 px

960 px

678 px

350 px

300 px

Notes

Plain checks on what was found. Worth fixing if you look after this site.

Notes

● FineThe title is 57 characters, short enough to show in full in search results.

Questions

Quick answers, from the same capture as the rest of this guide.

Questions

What font does CNBC use?: CNBC’s website uses four typefaces: Proxima Nova (headings and body text), served from static-redesign.cnbcfm.com; Lyon, served from static-redesign.cnbcfm.com; Lato, served from static-redesign.cnbcfm.com; Averta, served from static-redesign.cnbcfm.com.
What are CNBC’s brand colours?: The main colours on cnbc.com are Light Midnight Blue (#002F6C), Deep Royal Blue (#005594), Deep Midnight Blue (#071D39), Midnight Blue (#001E5A), Golden Rod (#FCB700) and Light Royal Blue (#0053CF).
What colour is CNBC’s text and background?: Body text is #171717 on a #FFFFFF background.
Where is CNBC’s logo from?: The logo shown in this guide was found on cnbc.com’s homepage. For official logo files and usage rules, check CNBC’s own brand or press page.
Is this CNBC’s official style guide?: No. SiteStyleGuide made it from cnbc.com’s public web pages on 5 November 2026, and isn’t affiliated with CNBC. Members can refresh a guide after 90 days to pick up changes.

Design tokens

Everything above as CSS variables, ready to paste into a project. Members can download the tokens as files for Figma (Tokens Studio), Style Dictionary and Tailwind.

Tokens

cnbc-com-tokens.css

Download

Free with an account: sign up or sign in, and you’ll come straight back here.

/* cnbc.com design tokens, from SiteStyleGuide (https://sitestyleguide.com/cnbc.com) */
:root {
  /* Colours */
  --text: #171717;
  --background: #FFFFFF;
  --colour-white: #FFFFFF;
  --colour-near-black: #171717;
  --colour-grey: #747474;
  --colour-black: #000000;
  --colour-light-midnight-blue: #002F6C;
  --colour-deep-royal-blue: #005594;
  --colour-deep-midnight-blue: #071D39;
  --colour-midnight-blue: #001E5A;
  --colour-golden-rod: #FCB700;
  --colour-light-royal-blue: #0053CF;
  --colour-steel-blue: #2077B6;
  --colour-sea-green: #008456;
  --colour-crimson: #CE2B2B;
  --colour-medium-sea-green: #00A857;
  --colour-black-2: #00081A;
  --colour-dodger-blue: #0496FF;
  --gradient-1: linear-gradient(180deg,#1e579900 0,#000);
  --gradient-2: linear-gradient(270deg,#0000,#005594);
  --gradient-3: linear-gradient(270deg,#005594,#0000);

  /* Typefaces */
  --font-headings: 'Proxima Nova', 'Helvetica', 'Arial', sans-serif;
  --font-buttons: 'Proxima Nova', 'Helvetica', 'Arial', sans-serif;
  --font-body: 'Proxima Nova', 'Helvetica', 'Arial', sans-serif;
  --font-other: 'Averta', 'Helvetica', 'Arial', sans-serif;

  /* Type scale */
  --text-h2: 24px;
  --leading-h2: 27px;
  --text-p: calc(2cqi + 6px);
  --leading-p: 2;
  --text-button: 12px;
  --leading-button: 70px;
  --text-a: 12px;
  --leading-a: 15px;

  /* Shape */
  --radius-1: 3px;
  --radius-2: 4px;
  --radius-3: 2px;
  --radius-4: 100%;
  --radius-5: 50%;
  --radius-6: 5px;

  /* Layout (breakpoints can’t be used in media queries as variables; they’re here for reference) */
  --breakpoint-1: 360px;
  --breakpoint-2: 759px;
  --breakpoint-3: 760px;
  --breakpoint-4: 1019px;
  --breakpoint-5: 1020px;
  --breakpoint-6: 1180px;
  --breakpoint-7: 1339px;
  --breakpoint-8: 1340px;
  --max-width-1: 1290px;
  --max-width-2: 1000px;
  --max-width-3: 960px;
  --max-width-4: 678px;
  --max-width-5: 350px;
  --max-width-6: 300px;
}

{
    "site": "cnbc.com",
    "source": "https://sitestyleguide.com/cnbc.com",
    "text": "#171717",
    "background": "#FFFFFF",
    "colours": [
        {
            "name": "White",
            "hex": "#FFFFFF",
            "rgb": [
                255,
                255,
                255
            ]
        },
        {
            "name": "Near Black",
            "hex": "#171717",
            "rgb": [
                23,
                23,
                23
            ]
        },
        {
            "name": "Grey",
            "hex": "#747474",
            "rgb": [
                116,
                116,
                116
            ]
        },
        {
            "name": "Black",
            "hex": "#000000",
            "rgb": [
                0,
                0,
                0
            ]
        },
        {
            "name": "Light Midnight Blue",
            "hex": "#002F6C",
            "rgb": [
                0,
                47,
                108
            ]
        },
        {
            "name": "Deep Royal Blue",
            "hex": "#005594",
            "rgb": [
                0,
                85,
                148
            ]
        },
        {
            "name": "Deep Midnight Blue",
            "hex": "#071D39",
            "rgb": [
                7,
                29,
                57
            ]
        },
        {
            "name": "Midnight Blue",
            "hex": "#001E5A",
            "rgb": [
                0,
                30,
                90
            ]
        },
        {
            "name": "Golden Rod",
            "hex": "#FCB700",
            "rgb": [
                252,
                183,
                0
            ]
        },
        {
            "name": "Light Royal Blue",
            "hex": "#0053CF",
            "rgb": [
                0,
                83,
                207
            ]
        },
        {
            "name": "Steel Blue",
            "hex": "#2077B6",
            "rgb": [
                32,
                119,
                182
            ]
        },
        {
            "name": "Sea Green",
            "hex": "#008456",
            "rgb": [
                0,
                132,
                86
            ]
        },
        {
            "name": "Crimson",
            "hex": "#CE2B2B",
            "rgb": [
                206,
                43,
                43
            ]
        },
        {
            "name": "Medium Sea Green",
            "hex": "#00A857",
            "rgb": [
                0,
                168,
                87
            ]
        },
        {
            "name": "Black",
            "hex": "#00081A",
            "rgb": [
                0,
                8,
                26
            ]
        },
        {
            "name": "Dodger Blue",
            "hex": "#0496FF",
            "rgb": [
                4,
                150,
                255
            ]
        }
    ],
    "fonts": [
        {
            "name": "Proxima Nova",
            "stack": "Proxima Nova, Helvetica, Arial, sans-serif",
            "weights": [
                400,
                450,
                500,
                600,
                700,
                800,
                900
            ],
            "source": "Served from static-redesign.cnbcfm.com"
        },
        {
            "name": "Lyon",
            "stack": "Lyon, Helvetica, Arial, sans-serif",
            "weights": [
                400,
                500,
                600,
                800
            ],
            "source": "Served from static-redesign.cnbcfm.com"
        },
        {
            "name": "Lato",
            "stack": "Lato, Helvetica, Arial, sans-serif",
            "weights": [
                400,
                700,
                900
            ],
            "source": "Served from static-redesign.cnbcfm.com"
        },
        {
            "name": "Averta",
            "stack": "Averta, Helvetica, Arial, sans-serif",
            "weights": [
                400,
                600,
                700,
                800
            ],
            "source": "Served from static-redesign.cnbcfm.com"
        }
    ]
}

Other websites using Proxima Nova as their main typeface

about.me

about.me · set in Proxima Nova
Save
Healthline

healthline.com · set in Proxima Nova
Save
CBS News

cbsnews.com · set in Proxima Nova
Save
Bleacher Report

bleacherreport.com · set in Proxima Nova
Save

Websites whose lead colour is closest to CNBC’s

Node.js

nodejs.org · 4 days ago
Save
Salesforce

salesforce.com · 6 days ago
Save
gameforge.com

gameforge.com · 1 day ago
Save
Diario ABC

abc.es · 1 hour ago
Save

Captured from cnbc.com on 5 November 2026. SiteStyleGuide isn’t affiliated with or endorsed by CNBC; this guide describes the public website for reference.

CNBCstyle guide

Title &description

Logo

Favicons

Colour

Balance

Neutrals

White

Near Black

Grey

Black

Colours

Light Midnight Blue

Deep Royal Blue

Deep Midnight Blue

Midnight Blue

Golden Rod

Light Royal Blue

Steel Blue

Sea Green

Crimson

Medium Sea Green

Black

Dodger Blue

Gradients

Dark mode

Proxima Nova

Type scale

Sizes in use

Elements

Grid

Notes

Questions

Tokens

Share

Run cnbc.com?

Also set in Proxima Nova

about.me

Healthline

CBS News

Bleacher Report

Similar colours

Node.js

Salesforce

gameforge.com

Diario ABC

Title &
description