What font does Harvard Business Review use?

Harvard Business Review’s website uses two typefaces: GT America (headings and body text), self-hosted; Tiempos Headline, self-hosted.

What are Harvard Business Review’s brand colours?

The main colours on hbr.org are Fire Brick (#C82502), Steel Blue (#0778B1), Dark Slate Grey (#075E64), Dark Red (#A01E02), Cadet Blue (#67AEBD) and Red (#DC0000).

What colour is Harvard Business Review’s text and background?

Body text is #282828 on a #FFFFFF background.

Where is Harvard Business Review’s logo from?

The logo shown in this guide was found on hbr.org’s homepage. For official logo files and usage rules, check Harvard Business Review’s own brand or press page.

Is this Harvard Business Review’s official style guide?

No. SiteStyleGuide made it from hbr.org’s public web pages on 23 October 2026, and isn’t affiliated with Harvard Business Review. Members can refresh a guide after 90 days to pick up changes.

Unofficial A style guide made by SiteStyleGuide from hbr.org’s public web pages. Not affiliated with or endorsed by Harvard Business Review. The real site is hbr.org ↗

Unofficial style guide

Harvard Business Reviewstyle guide

Harvard Business Review’s website (hbr.org) uses GT America for its headings and body text. Its palette is led by Fire Brick (#C82502), Steel Blue (#0778B1) and Dark Slate Grey (#075E64), with #282828 text on #FFFFFF. Captured from the live site on 23 October 2026.

Website: hbr.org
Typefaces: GT America, Tiempos Headline
Palette: 4 neutrals, 11 colours
Captured: 23 Oct 2026 · added by @sitestyleguide

Save Add to collection Share Report

Screenshot of the hbr.org homepage on a desktop screen — Screenshot of hbr.org on a 1440 px desktop screen, 23 Oct 2026.

Screenshot of the hbr.org 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: Harvard Business Review - Ideas and Advice for Leaders; ● 54 / 60 characters
Meta description: Find new ideas and classic advice on strategy, innovation and leadership, for global leaders from the world's best business and management experts.; ● 147 / 160 characters
og:title: Harvard Business Review - Ideas and Advice for Leaders
og:description: Find new ideas and classic advice on strategy, innovation and leadership, for global leaders from the world's best business and management experts.
Language: en

In search results

Harvard Business Reviewhttps://hbr.org/

Harvard Business Review - Ideas and Advice for Leaders

Find new ideas and classic advice on strategy, innovation and leadership, for global leaders from the world's best business and management experts.

When shared

No og:image, so no picture

hbr.org

Harvard Business Review - Ideas and Advice for Leaders

Find new ideas and classic advice on strategy, innovation and leadership, for global leaders from the world's…

Logo & favicons

Found as: SVG in the header. SVG, 130 × 148.

Logo

On white

On black

On Fire Brick

Favicons

6 found

512 px · PNG icon
223 px · ICO favicon.ico
192 px · PNG icon
180 px · PNG apple-touch-icon
32 px · PNG icon
16 px · PNG icon

Harvard Business Review - Ideas and Advice for Leaders

Light browser tab

Harvard Business Review - Ideas and Advice for Leaders

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 (#282828) and white, using WCAG 2 ratios: 4.5 for body text, 3 for large text.

Colour

Balance

How much each colour is used

Charcoal 32.3%
Near Black 22.3%
Off White 16.3%
White 15%
Fire Brick 4.6%
Steel Blue 2.7%
Dark Slate Grey 1.6%
Dark Red 1.2%
Cadet Blue 1.2%
Red 0.7%
Dark Golden Rod 0.5%
Golden Rod 0.5%
Papaya Whip 0.5%
Orange Red 0.4%
Chocolate 0.4%

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

Charcoal

HEX

RGB

HSL

OKLCH

CMYK
0 0 0 84

On text
—

On white
14.74:1 AAA

Text, background, graphic · .FeedCard-module_title__OjYLX, .ExecutiveContentRow-module_title__avpzP
Near Black

HEX

RGB

HSL

OKLCH

CMYK
0 0 0 93

On text
1.28:1 Fail

On white
18.88:1 AAA

Text, background, graphic · .Button-module_alternate__iLJoF, .ForgotPasswordForm-module_title__l1VPc
Off White

HEX

RGB

HSL

OKLCH

CMYK
0 0 0 11

On text
11.38:1 AAA

On white
1.30:1 Fail

Background, border, graphic · .ContentRowTile-module-scss-module__OUWZoq__article-heading-container:before, .ListTile-module-scss-module__cwQgSW__article-heading-container:before
White

HEX

RGB

HSL

OKLCH

CMYK
0 0 0 0

On text
14.74:1 AAA

On white
—

Background, text, graphic · .Header-module_ad-container__VaVxb, .Header-module_main-content__pEOjn

Colours

Brand colours and accents, most used first

Fire Brick

HEX

RGB

HSL

OKLCH

CMYK
0 82 99 22

On text
2.61:1 Fail

On white
5.64:1 AA

Text, background, border · .Button-module_primary__st6yY, .Header-module_subscribe-button__mGvj9
Steel Blue

HEX

RGB

HSL

OKLCH

CMYK
96 32 0 31

On text
3.04:1 AA large

On white
4.85:1 AA

Text · .ForgotPasswordForm-module_cta__hjD5K.ForgotPasswordForm-module_get-help__wxGa4, .ForgotPasswordForm-module_notice-a__HAV1F
Dark Slate Grey

HEX

RGB

HSL

OKLCH

CMYK
93 6 0 61

On text
1.96:1 Fail

On white
7.52:1 AAA

Text, graphic · .PopularCard-module_topic-link__pG7ie, .MediaCard-module-scss-module__4ch6iG__media-slug
Dark Red

HEX

RGB

HSL

OKLCH

CMYK
0 81 99 37

On text
1.88:1 Fail

On white
7.83:1 AAA

Background, text · .Button-module_primary__st6yY:hover, .Header-module_subscribe-button__mGvj9:hover
Cadet Blue

HEX

RGB

HSL

OKLCH

CMYK
46 8 0 26

On text
5.87:1 AA

On white
2.51:1 Fail

Text · .DigitalArticleCard-module-scss-module__91GfPG__slug, .SponsorCard-module-scss-module__q-QiiG__slug
Red

HEX

RGB

HSL

OKLCH

CMYK
0 100 100 14

On text
2.84:1 Fail

On white
5.19:1 AA

Background · .Header-module_subscribe-button__mGvj9, .MegaMenu-module_subscribe-button__EjJ2M
Dark Golden Rod

HEX

RGB

HSL

OKLCH

CMYK
0 31 99 38

On text
3.21:1 AA large

On white
4.59:1 AA

Text · .WebinarTout-module-scss-module__dWoj4a__title
Golden Rod

HEX

RGB

HSL

OKLCH

CMYK
0 20 64 20

On text
6.27:1 AA

On white
2.35:1 Fail

Background, text, graphic · .ExecutiveFooter-module_footer__FZiYF, .LinksSection-module_feedback-icon__ieRhG
Papaya Whip

HEX

RGB

HSL

OKLCH

CMYK
0 5 15 0

On text
13.40:1 AAA

On white
1.10:1 Fail

Background · .ExecutiveAuthModal-module_executive-modal__m8ZGZ, .PopularHBRRow-module_popular-section__JmJ8-
Orange Red

HEX

RGB

HSL

OKLCH

CMYK
0 67 99 0

On text
4.57:1 AA

On white
3.22:1 AA large

Text, graphic, border · .SaveModal-module_dup-folder-error__QQ0QN, .SVGIcon-module_fill-orange-red__zn9bY
Chocolate

HEX

RGB

HSL

OKLCH

CMYK
0 58 100 0

On text
5.13:1 AA

On white
2.87:1 Fail

Graphic · .SVGIcon-module_for-you-2__vo-F2, .SVGIcon-module_magazine-2__e2sww

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.

GT America

Aa 200 Aa 700

GT America

Self-hosted · weights 200, 400, 500, 600, 700 · headings, buttons · shown in a stand-in if you don’t have it

Aa 400 Aa 800

Tiempos Headline

Self-hosted · weights 400, 600, 700, 800 · headings · shown in a stand-in if you don’t have it

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

Type scale

From the site’s CSS

Heading 2 1.0625rem · 17 px weight 700

Harvard Business Review - Ideas and Advice for …

Sizes in use

Most common across the site

20pxline 1.5rem · 10 rules
18pxline 1.3125rem · 15 rules
17pxline 1.125rem · 23 rules
16pxline 1.25rem · 45 rules
15pxline 1.0625rem · 40 rules
14pxline .9375rem · 42 rules
13pxline 1.1875rem · 62 rules
12pxline 1.25rem · 15 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

.Button-module_primary__st6yY · #C82502

Corner radius

3px · 20×
2px · 7×
4px · 4×
7px · 1×
100% 0 0 100%/50% 0 0 50% · 1×
0 100% 100% 0/0 50% 50% 0 · 1×

Shadows

0 0 12px #32323233
0 0 12px #3232321a
0 3px 3px #00000012
0 0 13px 2px #d5dcdf

Layout

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

Grid

Breakpoints

520

657

768

818

1020

1024

1025

1366

On a scale of 0 to 1440 px.

Content widths (max-width)

1210 px

657 px

444 px

440 px

373 px

300 px

Notes

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

Notes

● FineThe title is 54 characters, short enough to show in full in search results.
▲ CheckThere is no og:image, so links shared on social media show no picture.

Questions

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

Questions

What font does Harvard Business Review use?: Harvard Business Review’s website uses two typefaces: GT America (headings and body text), self-hosted; Tiempos Headline, self-hosted.
What are Harvard Business Review’s brand colours?: The main colours on hbr.org are Fire Brick (#C82502), Steel Blue (#0778B1), Dark Slate Grey (#075E64), Dark Red (#A01E02), Cadet Blue (#67AEBD) and Red (#DC0000).
What colour is Harvard Business Review’s text and background?: Body text is #282828 on a #FFFFFF background.
Where is Harvard Business Review’s logo from?: The logo shown in this guide was found on hbr.org’s homepage. For official logo files and usage rules, check Harvard Business Review’s own brand or press page.
Is this Harvard Business Review’s official style guide?: No. SiteStyleGuide made it from hbr.org’s public web pages on 23 October 2026, and isn’t affiliated with Harvard Business Review. 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

hbr-org-tokens.css

Download

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

/* hbr.org design tokens, from SiteStyleGuide (https://sitestyleguide.com/hbr.org) */
:root {
  /* Colours */
  --text: #282828;
  --background: #FFFFFF;
  --colour-charcoal: #282828;
  --colour-near-black: #111111;
  --colour-off-white: #E2E2E2;
  --colour-white: #FFFFFF;
  --colour-fire-brick: #C82502;
  --colour-steel-blue: #0778B1;
  --colour-dark-slate-grey: #075E64;
  --colour-dark-red: #A01E02;
  --colour-cadet-blue: #67AEBD;
  --colour-red: #DC0000;
  --colour-dark-golden-rod: #9D6C01;
  --colour-golden-rod: #CDA349;
  --colour-papaya-whip: #FFF3DA;
  --colour-orange-red: #FE5502;
  --colour-chocolate: #FF6A00;

  /* Typefaces */
  --font-headings: 'GT America', 'helvetica', 'Helvetica Neue', 'verdana', 'arial', sans-serif;
  --font-buttons: 'GT America', 'helvetica', 'Helvetica Neue', 'verdana', 'arial', sans-serif;

  /* Type scale */
  --text-h2: 1.0625rem;

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

  /* Layout (breakpoints can’t be used in media queries as variables; they’re here for reference) */
  --breakpoint-1: 520px;
  --breakpoint-2: 657px;
  --breakpoint-3: 768px;
  --breakpoint-4: 818px;
  --breakpoint-5: 1020px;
  --breakpoint-6: 1024px;
  --breakpoint-7: 1025px;
  --breakpoint-8: 1366px;
  --max-width-1: 1210px;
  --max-width-2: 657px;
  --max-width-3: 444px;
  --max-width-4: 440px;
  --max-width-5: 373px;
  --max-width-6: 300px;
}

{
    "site": "hbr.org",
    "source": "https://sitestyleguide.com/hbr.org",
    "text": "#282828",
    "background": "#FFFFFF",
    "colours": [
        {
            "name": "Charcoal",
            "hex": "#282828",
            "rgb": [
                40,
                40,
                40
            ]
        },
        {
            "name": "Near Black",
            "hex": "#111111",
            "rgb": [
                17,
                17,
                17
            ]
        },
        {
            "name": "Off White",
            "hex": "#E2E2E2",
            "rgb": [
                226,
                226,
                226
            ]
        },
        {
            "name": "White",
            "hex": "#FFFFFF",
            "rgb": [
                255,
                255,
                255
            ]
        },
        {
            "name": "Fire Brick",
            "hex": "#C82502",
            "rgb": [
                200,
                37,
                2
            ]
        },
        {
            "name": "Steel Blue",
            "hex": "#0778B1",
            "rgb": [
                7,
                120,
                177
            ]
        },
        {
            "name": "Dark Slate Grey",
            "hex": "#075E64",
            "rgb": [
                7,
                94,
                100
            ]
        },
        {
            "name": "Dark Red",
            "hex": "#A01E02",
            "rgb": [
                160,
                30,
                2
            ]
        },
        {
            "name": "Cadet Blue",
            "hex": "#67AEBD",
            "rgb": [
                103,
                174,
                189
            ]
        },
        {
            "name": "Red",
            "hex": "#DC0000",
            "rgb": [
                220,
                0,
                0
            ]
        },
        {
            "name": "Dark Golden Rod",
            "hex": "#9D6C01",
            "rgb": [
                157,
                108,
                1
            ]
        },
        {
            "name": "Golden Rod",
            "hex": "#CDA349",
            "rgb": [
                205,
                163,
                73
            ]
        },
        {
            "name": "Papaya Whip",
            "hex": "#FFF3DA",
            "rgb": [
                255,
                243,
                218
            ]
        },
        {
            "name": "Orange Red",
            "hex": "#FE5502",
            "rgb": [
                254,
                85,
                2
            ]
        },
        {
            "name": "Chocolate",
            "hex": "#FF6A00",
            "rgb": [
                255,
                106,
                0
            ]
        }
    ],
    "fonts": [
        {
            "name": "GT America",
            "stack": "GT America, helvetica, Helvetica Neue, verdana, arial, sans-serif",
            "weights": [
                200,
                400,
                500,
                600,
                700
            ],
            "source": "Self-hosted"
        },
        {
            "name": "Tiempos Headline",
            "stack": "Tiempos Headline",
            "weights": [
                400,
                600,
                700,
                800
            ],
            "source": "Self-hosted"
        }
    ]
}

Other websites using GT America as their main typeface

Zia Tile

ziatile.com · set in GT America
Save
frog, part of Capgemini Invent

frog.co · set in GT America
Save
Betterment

betterment.com · set in GT America
Save
Emergence Magazine

emergencemagazine.org · set in GT America
Save

Websites whose lead colour is closest to Harvard Business Review’s

I

ITmedia

itmedia.co.jp · 12 hours ago
Save
HELLO!

hellomagazine.com · 4 days ago
Save
Free

free.fr · 5 days ago
Save
GSMArena.com

gsmarena.com · 3 days ago
Save

Captured from hbr.org on 23 October 2026. SiteStyleGuide isn’t affiliated with or endorsed by Harvard Business Review; this guide describes the public website for reference.

Harvard Business Reviewstyle guide

Title &description

Logo

Favicons

Colour

Balance

Neutrals

Charcoal

Near Black

Off White

White

Colours

Fire Brick

Steel Blue

Dark Slate Grey

Dark Red

Cadet Blue

Red

Dark Golden Rod

Golden Rod

Papaya Whip

Orange Red

Chocolate

GT America

Type scale

Sizes in use

Elements

Grid

Notes

Questions

Tokens

Share

Run hbr.org?

Also set in GT America

Zia Tile

frog, part of Capgemini Invent

Betterment

Emergence Magazine

Similar colours

ITmedia

HELLO!

Free

GSMArena.com

Title &
description