What font does Al Jazeera use?

Al Jazeera’s website uses one typeface: Al-Jazeera (headings and body text), self-hosted.

What are Al Jazeera’s brand colours?

The main colours on aljazeera.com are Light Dodger Blue (#32A2EF), Deep Dodger Blue (#118ADD), Crimson (#C31833), Royal Blue (#005FA1), Dark Orange (#FA9000) and Red (#E00102).

What colour is Al Jazeera’s text and background?

Body text is #000000 on a #FFFFFF background.

Where is Al Jazeera’s logo from?

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

Is this Al Jazeera’s official style guide?

No. SiteStyleGuide made it from aljazeera.com’s public web pages on 22 October 2026, and isn’t affiliated with Al Jazeera. Members can refresh a guide after 90 days to pick up changes.

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

Unofficial style guide

Al Jazeerastyle guide

Al Jazeera’s website (aljazeera.com) uses Al-Jazeera for its headings and body text. Its palette is led by Light Dodger Blue (#32A2EF), Deep Dodger Blue (#118ADD) and Crimson (#C31833), with #000000 text on #FFFFFF. Captured from the live site on 22 October 2026.

Website: aljazeera.com
Typefaces: Al-Jazeera
Palette: 4 neutrals, 12 colours, 3 gradients
Captured: 22 Oct 2026 · added by @sitestyleguide

Save Add to collection Share Report

Screenshot of the aljazeera.com homepage on a desktop screen — Screenshot of aljazeera.com on a 1440 px desktop screen, 22 Oct 2026.

Screenshot of the aljazeera.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: Breaking News, World News and Video from Al Jazeera; ● 51 / 60 characters
Meta description: News, analysis from the Middle East & worldwide, multimedia & interactives, opinions, documentaries, podcasts, long reads and broadcast schedule.; ● 145 / 160 characters
Site name: Al Jazeera
og:title: Breaking News, World News and Video from Al Jazeera
og:description: News, analysis from the Middle East & worldwide, multimedia & interactives, opinions, documentaries, podcasts, long reads and broadcast schedule.
Language: en

In search results

Al Jazeerahttps://www.aljazeera.com/

Breaking News, World News and Video from Al Jazeera

News, analysis from the Middle East & worldwide, multimedia & interactives, opinions, documentaries, podcasts, long reads and broadcast schedule.

When shared

aljazeera.com

Breaking News, World News and Video from Al Jazeera

News, analysis from the Middle East & worldwide, multimedia & interactives, opinions, documentaries, podcasts…

Logo & favicons

Found as: schema.org logo. PNG, 224 × 291.

Logo

On white

On black

On Light Dodger Blue

Favicons

1 found

48 px · ICO shortcut icon

Breaking News, World News and Video from Al Jazeera

Light browser tab

Breaking News, World News and Video from Al Jazeera

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

Colour

Balance

How much each colour is used

White 34%
Black 26.2%
Dark Grey 11%
Off White 9.1%
Light Dodger Blue 8.6%
Deep Dodger Blue 3.9%
Crimson 2.7%
Royal Blue 0.9%
Dark Orange 0.7%
Red 0.6%
Black 0.5%
Midnight Blue 0.5%
Light Sea Green 0.4%
Light Steel Blue 0.4%
Steel Blue 0.4%
Slate Grey 0.2%

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
21.00:1 AAA

On white
—

Text, background, graphic · .article-survey-widget:not(.article-survey-widget--stacked) .nudge.nudge--survey, .branded-collection-card.card-collection-flat--with-image .card-collection-flat_
Black

HEX

RGB

HSL

OKLCH

CMYK
0 0 0 100

On text
—

On white
21.00:1 AAA

Text, background, graphic · .article-card__image-wrap .loading.l-fullViewportHeight, #menu-sidebar .header-menu.header-menu--dark .menu__submenu
Dark Grey

HEX

RGB

HSL

OKLCH

CMYK
0 0 0 65

On text
3.00:1 AA large

On white
7.00:1 AAA

Text, background, border · .ads .ads__title, amp-accordion.footer-menu section>h2
Off White

HEX

RGB

HSL

OKLCH

CMYK
0 0 0 10

On text
16.67:1 AAA

On white
1.26:1 Fail

Background, border, text · .container--qid-wrapper.container--qid-light .qid-background-image .responsive-i, .entity-card__title--skeleton

Colours

Brand colours and accents, most used first

Light Dodger Blue

HEX

RGB

HSL

OKLCH

CMYK
79 32 0 6

On text
7.55:1 AAA

On white
2.78:1 Fail

Background, border, graphic · .card-collection--style-carousel .branded-collection-title.branded--bar:before, .container--three-col-layout-wrapper #featured-news-container article.article-ca
Deep Dodger Blue

HEX

RGB

HSL

OKLCH

CMYK
92 38 0 13

On text
5.70:1 AA

On white
3.68:1 AA large

Border, background, graphic · .audio-hub-main-button, .audio-hub-main-button-podcasts
Crimson

HEX

RGB

HSL

OKLCH

CMYK
0 88 74 24

On text
3.50:1 AA large

On white
6.00:1 AA

Background, text, graphic · .container--three-col-layout-wrapper #featured-news-container article.article-ca, .pre_video-wrapper .live-badge
Royal Blue

HEX

RGB

HSL

OKLCH

CMYK
100 41 0 37

On text
3.15:1 AA large

On white
6.66:1 AA

Background, text, graphic · .article-survey-widget--stacked .nudge.nudge--survey, .article-survey-widget:not(.article-survey-widget--stacked) .nudge.nudge--survey
Dark Orange

HEX

RGB

HSL

OKLCH

CMYK
0 42 100 2

On text
9.05:1 AAA

On white
2.32:1 Fail

Background, text, border · .live-stream-player__geo-block-section .geo-block-redirect-button, .ajic-carousel .ajic-card__body a
Red

HEX

RGB

HSL

OKLCH

CMYK
0 100 99 12

On text
4.17:1 AA large

On white
5.03:1 AA

Background, text, border · button.auth-icon-btn.error:after, .aj-form p.error
Black

HEX

RGB

HSL

OKLCH

CMYK
53 97 0 87

On text
1.05:1 Fail

On white
20.01:1 AAA

Text, background, border · .article-survey-widget .nudge.nudge--survey a.button, .article-survey-widget .nudge.nudge--survey
Midnight Blue

HEX

RGB

HSL

OKLCH

CMYK
99 74 0 54

On text
1.45:1 Fail

On white
14.44:1 AAA

Background, graphic · .branded-collection-card.timer-only .card-collection-flat__title:before, --original-color
Light Sea Green

HEX

RGB

HSL

OKLCH

CMYK
100 0 9 32

On text
7.55:1 AAA

On white
2.78:1 Fail

Background · .article-survey-widget--stacked .nudge.nudge--survey, .article-survey-widget:not(.article-survey-widget--stacked) .nudge.nudge--survey
Light Steel Blue

HEX

RGB

HSL

OKLCH

CMYK
32 28 0 0

On text
10.90:1 AAA

On white
1.93:1 Fail

Background · .article-survey-widget .nudge.nudge--survey a.button, .article-survey-widget .nudge.nudge--survey a.button:focus
Steel Blue

HEX

RGB

HSL

OKLCH

CMYK
100 52 0 0

On text
5.23:1 AA

On white
4.02:1 AA large

Text, graphic, border · .swiper-button-next, .search-index a
Slate Grey

HEX

RGB

HSL

OKLCH

CMYK
31 26 0 39

On text
4.62:1 AA

On white
4.55:1 AA

Background · html.amp button.ampstart-btn.ampstart-btn-secondary.caps

Gradients

linear-gradient(90deg,#adb6fe,#fff)
linear-gradient(1turn,rgba(0,0,0,.8),rgba(0,0,0,.5904) 19%,rgba(0,0,0,.4328) 34%,rgba(0,0,0,.3056) 47%,rgba(0,0,0,.2224) 56.5%,rgba(0,0,0,.1552) 65%,rgba(0,0,0,.1008) 73%,rgba(0,0,0,.06) 80.2%,rgba(0,0,0,.0336) 86.1%,rgba(0,0,0,.0168) 91%,rgba(0,0,0,.0064) 95.2%,rgba(0,0,0,.0016) 98.2%,transparent)
linear-gradient(180deg,transparent,#000)

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.

Al-Jazeera

Aa 200 Aa 900

Al-Jazeera

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

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

Type scale

From the site’s CSS

Heading 1 2em · 32 px

Al Jazeera

Heading 2 1.375rem · 22 px / 1.5 weight 700 · Al-Jazeera

Breaking News, World News and Video from Al Jaz…

Heading 3 2rem · 32 px / 1 weight 900 · capitalize · Al-Jazeera

Breaking News, World News and Video from Al Jaz…

Heading 4 1.125rem · 18 px / 1.5 weight 700 · Al-Jazeera

Breaking News, World News and Video from Al Jaz…

Heading 5 —

Breaking News, World News and Video from Al Jaz…

Body — Al-Jazeera

News, analysis from the Middle East & worldwide, multimedia & interactives, opinions, documentaries, podcasts, long reads and broadcast sch…

Paragraph 1.375rem · 22 px / 1.5 weight 400

News, analysis from the Middle East & worldwide, multimedia & interactives, opinions, documentaries, podcasts, long reads and broadcast sch…

Small 80%

News, analysis from the Middle East & worldwide, multimedia & interactives, opinions, documentaries, podcasts, long reads and broadcast sch…

Button 100% / 1.15 none

Get started

Link 1rem · 16 px / 1.5 weight 700 · Helvetica

Sizes in use

Most common across the site

26pxline 1.5 · 20 rules
24pxline 2 · 22 rules
22pxline 1.5 · 20 rules
20pxline 1 · 39 rules
18pxline 1.5 · 67 rules
16pxline 1.5 · 89 rules
14pxline 1.5 · 79 rules
12pxline 1 · 19 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

html.amp button.ampstart-btn.ampstart-btn-secondary.caps · #6C749C · radius 2px

Corner radius

10px · 76×
50% · 22×
5px · 15×
4px · 13×
100px · 12×
20px · 10×

Shadows

0 2px 2px 0 rgba(0,0,0,.16)
0 2px 4px -4px rgba(0,0,0,.5)
unset
0 2px 12px rgba(0,0,0,.1)

Layout

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

Grid

Breakpoints

350

356

420

576

991

992

1159

1200

On a scale of 0 to 1440 px.

Content widths (max-width)

1200 px

1170 px

770 px

640 px

570 px

346 px

Notes

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

Notes

● FineThe title is 51 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 Al Jazeera use?: Al Jazeera’s website uses one typeface: Al-Jazeera (headings and body text), self-hosted.
What are Al Jazeera’s brand colours?: The main colours on aljazeera.com are Light Dodger Blue (#32A2EF), Deep Dodger Blue (#118ADD), Crimson (#C31833), Royal Blue (#005FA1), Dark Orange (#FA9000) and Red (#E00102).
What colour is Al Jazeera’s text and background?: Body text is #000000 on a #FFFFFF background.
Where is Al Jazeera’s logo from?: The logo shown in this guide was found on aljazeera.com’s homepage. For official logo files and usage rules, check Al Jazeera’s own brand or press page.
Is this Al Jazeera’s official style guide?: No. SiteStyleGuide made it from aljazeera.com’s public web pages on 22 October 2026, and isn’t affiliated with Al Jazeera. 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

aljazeera-com-tokens.css

Download

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

/* aljazeera.com design tokens, from SiteStyleGuide (https://sitestyleguide.com/aljazeera.com) */
:root {
  /* Colours */
  --text: #000000;
  --background: #FFFFFF;
  --colour-white: #FFFFFF;
  --colour-black: #000000;
  --colour-dark-grey: #595959;
  --colour-off-white: #E5E5E5;
  --colour-light-dodger-blue: #32A2EF;
  --colour-deep-dodger-blue: #118ADD;
  --colour-crimson: #C31833;
  --colour-royal-blue: #005FA1;
  --colour-dark-orange: #FA9000;
  --colour-red: #E00102;
  --colour-black-2: #100122;
  --colour-midnight-blue: #011F75;
  --colour-light-sea-green: #00AE9E;
  --colour-light-steel-blue: #ADB6FE;
  --colour-steel-blue: #007AFF;
  --colour-slate-grey: #6C749C;
  --gradient-1: linear-gradient(90deg,#adb6fe,#fff);
  --gradient-2: linear-gradient(1turn,rgba(0,0,0,.8),rgba(0,0,0,.5904) 19%,rgba(0,0,0,.4328) 34%,rgba(0,0,0,.3056) 47%,rgba(0,0,0,.2224) 56.5%,rgba(0,0,0,.1552) 65%,rgba(0,0,0,.1008) 73%,rgba(0,0,0,.06) 80.2%,rgba(0,0,0,.0336) 86.1%,rgba(0,0,0,.0168) 91%,rgba(0,0,0,.0064) 95.2%,rgba(0,0,0,.0016) 98.2%,transparent);
  --gradient-3: linear-gradient(180deg,transparent,#000);

  /* Typefaces */
  --font-headings: 'Al-Jazeera', 'Helvetica Neue', 'Helvetica', 'Arial', sans-serif;
  --font-body: 'Al-Jazeera', 'Helvetica Neue', 'Helvetica', 'Arial', sans-serif;
  --font-buttons: 'Al-Jazeera', 'Helvetica Neue', 'Helvetica', 'Arial', sans-serif;

  /* Type scale */
  --text-h1: 2em;
  --text-h2: 1.375rem;
  --leading-h2: 1.5;
  --text-h3: 2rem;
  --leading-h3: 1;
  --text-h4: 1.125rem;
  --leading-h4: 1.5;
  --text-p: 1.375rem;
  --leading-p: 1.5;
  --text-small: 80%;
  --text-button: 100%;
  --leading-button: 1.15;
  --text-a: 1rem;
  --leading-a: 1.5;

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

  /* Layout (breakpoints can’t be used in media queries as variables; they’re here for reference) */
  --breakpoint-1: 350px;
  --breakpoint-2: 356px;
  --breakpoint-3: 420px;
  --breakpoint-4: 576px;
  --breakpoint-5: 991px;
  --breakpoint-6: 992px;
  --breakpoint-7: 1159px;
  --breakpoint-8: 1200px;
  --max-width-1: 1200px;
  --max-width-2: 1170px;
  --max-width-3: 770px;
  --max-width-4: 640px;
  --max-width-5: 570px;
  --max-width-6: 346px;
}

{
    "site": "aljazeera.com",
    "source": "https://sitestyleguide.com/aljazeera.com",
    "text": "#000000",
    "background": "#FFFFFF",
    "colours": [
        {
            "name": "White",
            "hex": "#FFFFFF",
            "rgb": [
                255,
                255,
                255
            ]
        },
        {
            "name": "Black",
            "hex": "#000000",
            "rgb": [
                0,
                0,
                0
            ]
        },
        {
            "name": "Dark Grey",
            "hex": "#595959",
            "rgb": [
                89,
                89,
                89
            ]
        },
        {
            "name": "Off White",
            "hex": "#E5E5E5",
            "rgb": [
                229,
                229,
                229
            ]
        },
        {
            "name": "Light Dodger Blue",
            "hex": "#32A2EF",
            "rgb": [
                50,
                162,
                239
            ]
        },
        {
            "name": "Deep Dodger Blue",
            "hex": "#118ADD",
            "rgb": [
                17,
                138,
                221
            ]
        },
        {
            "name": "Crimson",
            "hex": "#C31833",
            "rgb": [
                195,
                24,
                51
            ]
        },
        {
            "name": "Royal Blue",
            "hex": "#005FA1",
            "rgb": [
                0,
                95,
                161
            ]
        },
        {
            "name": "Dark Orange",
            "hex": "#FA9000",
            "rgb": [
                250,
                144,
                0
            ]
        },
        {
            "name": "Red",
            "hex": "#E00102",
            "rgb": [
                224,
                1,
                2
            ]
        },
        {
            "name": "Black",
            "hex": "#100122",
            "rgb": [
                16,
                1,
                34
            ]
        },
        {
            "name": "Midnight Blue",
            "hex": "#011F75",
            "rgb": [
                1,
                31,
                117
            ]
        },
        {
            "name": "Light Sea Green",
            "hex": "#00AE9E",
            "rgb": [
                0,
                174,
                158
            ]
        },
        {
            "name": "Light Steel Blue",
            "hex": "#ADB6FE",
            "rgb": [
                173,
                182,
                254
            ]
        },
        {
            "name": "Steel Blue",
            "hex": "#007AFF",
            "rgb": [
                0,
                122,
                255
            ]
        },
        {
            "name": "Slate Grey",
            "hex": "#6C749C",
            "rgb": [
                108,
                116,
                156
            ]
        }
    ],
    "fonts": [
        {
            "name": "Al-Jazeera",
            "stack": "\"Al-Jazeera\", \"Helvetica Neue\", \"Helvetica\", \"Arial\", sans-serif",
            "weights": [
                200,
                300,
                400,
                700,
                900
            ],
            "source": "Self-hosted"
        }
    ]
}

Websites whose lead colour is closest to Al Jazeera’s

GetResponse

getresponse.com · 3 days ago
Save
آپارات

aparat.com · 1 day ago
Save
Snapchat

snapchat.com · 3 days ago
Save
Gismeteo

gismeteo.ru · 3 days ago
Save

Captured from aljazeera.com on 22 October 2026. SiteStyleGuide isn’t affiliated with or endorsed by Al Jazeera; this guide describes the public website for reference.

Al Jazeerastyle guide

Title &description

Logo

Favicons

Colour

Balance

Neutrals

White

Black

Dark Grey

Off White

Colours

Light Dodger Blue

Deep Dodger Blue

Crimson

Royal Blue

Dark Orange

Red

Black

Midnight Blue

Light Sea Green

Light Steel Blue

Steel Blue

Slate Grey

Gradients

Al-Jazeera

Type scale

Sizes in use

Elements

Grid

Notes

Questions

Tokens

Share

Run aljazeera.com?

Similar colours

GetResponse

آپارات

Snapchat

Gismeteo

Title &
description