What font does Tubi use?

Tubi’s website uses three typefaces: Inter (headings and body text), self-hosted; TubiStans, self-hosted; text-security, self-hosted.

What are Tubi’s brand colours?

The main colours on tubitv.com are Deep Black (#0B0019), Yellow (#FFFF13), Blue (#1D00F2), Slate Blue (#2948FF), Indigo (#53008B) and Black (#161324).

What colour is Tubi’s text and background?

Body text is #000000 on a #FFFFFF background.

Where is Tubi’s logo from?

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

Is this Tubi’s official style guide?

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

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

Unofficial style guide

Tubistyle guide

Tubi’s website (tubitv.com) uses Inter for its headings and body text. Its palette is led by Deep Black (#0B0019), Yellow (#FFFF13) and Blue (#1D00F2), with #000000 text on #FFFFFF. Captured from the live site on 25 October 2026.

Website: tubitv.com
Typefaces: Inter, TubiStans, text-security
Palette: 4 neutrals, 12 colours, 3 gradients
Captured: 25 Oct 2026 · added by @sitestyleguide

Save Add to collection Share Report

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

Screenshot of the tubitv.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: Watch Free Movies and TV Shows Online | Tubi; ● 44 / 60 characters
Meta description: Watch free movies and TV shows online in HD on any device. Tubi offers streaming movies in genres like Action, Horror, Sci-Fi, Crime and Comedy. Watch now.; ● 155 / 160 characters
Site name: Tubi
og:title: Watch Free TV & Movies Online | Stream Full Length Videos | Tubi
og:description: Watch free on Tubi. From deep cuts to hit movies, shows, series, live TV and awarded originals. No subscription. Free forever.
Language: en
Theme colour: #10141F

In search results

Tubihttps://tubitv.com/

Watch Free Movies and TV Shows Online | Tubi

Watch free movies and TV shows online in HD on any device. Tubi offers streaming movies in genres like Action, Horror, Sci-Fi, Crime and Comedy. Watch now.

When shared

tubitv.com

Watch Free TV & Movies Online | Stream Full Length Videos | Tubi

Watch free on Tubi. From deep cuts to hit movies, shows, series, live TV and awarded originals. No subscripti…

Logo & favicons

Found as: schema.org logo. PNG, 512 × 512.

Logo

On white

On black

On Deep Black

Favicons

4 found

512 px · PNG manifest
192 px · PNG manifest
180 px · PNG apple-touch-icon
48 px · PNG icon

Watch Free Movies and TV Shows Online | Tubi

Light browser tab

Watch Free Movies and TV Shows Online | Tubi

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 39.2%
Deep Black 14.4%
Yellow 11.1%
Blue 9.2%
Slate Blue 4.6%
Indigo 3.1%
Black 2.7%
Orange Red 2.6%
Black 2.5%
Blue Violet 2.2%
Cool Charcoal 2%
Orange 1.8%
Cool Grey 1.3%
Crimson 1.1%
Medium Violet Red 1.1%
Light Black 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
21.00:1 AAA

On white
—

Text, background, border · [aria-selected=true] .Tabs__tab-title--mode-button, --disconnected-color
Black

HEX

RGB

HSL

OKLCH

CMYK
0 0 0 100

On text
—

On white
21.00:1 AAA

Background, text, border · .CiW8z:after, .MmqyX .l80S9
Cool Charcoal

HEX

RGB

HSL

OKLCH

CMYK
16 16 0 82

On text
1.40:1 Fail

On white
15.03:1 AAA

Text, background · .Button--secondary.Button--inverse .Button__bg, .Button--secondary
Cool Grey

HEX

RGB

HSL

OKLCH

CMYK
16 7 0 47

On text
4.92:1 AA

On white
4.27:1 AA large

Text, background, border · .Button--inverse .Button__bg, .Tabs__tab-title--mode-button

Colours

Brand colours and accents, most used first

Deep Black

HEX

RGB

HSL

OKLCH

CMYK
56 100 0 90

On text
1.03:1 Fail

On white
20.42:1 AAA

Background, text, graphic · .defaultDarkTheme .iYmyN, .defaultDarkTheme .dMVud
Yellow

HEX

RGB

HSL

OKLCH

CMYK
0 0 93 0

On text
19.57:1 AAA

On white
1.07:1 Fail

Text, background, border · --connected-color, .defaultDarkTheme .ab-in-app-message button.ab-message-button
Blue

HEX

RGB

HSL

OKLCH

CMYK
88 100 0 5

On text
2.33:1 Fail

On white
9.00:1 AAA

Background, text, graphic · .kidsDarkTheme .NSwPx .lhco8:after, .kidsDarkTheme .iYmyN
Slate Blue

HEX

RGB

HSL

OKLCH

CMYK
84 72 0 0

On text
3.47:1 AA large

On white
6.06:1 AA

Background, border, text · .kidsDarkTheme .OpEE9.XtCbn .wEHu5 .oBrXV .fq7Lz, .kidsDarkTheme .web-tooltip__container.dark
Indigo

HEX

RGB

HSL

OKLCH

CMYK
40 100 0 45

On text
1.74:1 Fail

On white
12.06:1 AAA

Background, text · .defaultDarkTheme .iYmyN, .kidsDarkTheme .iYmyN
Black

HEX

RGB

HSL

OKLCH

CMYK
39 47 0 86

On text
1.15:1 Fail

On white
18.22:1 AAA

Background, text, border · .defaultDarkTheme .OpEE9.XtCbn .wEHu5 .oBrXV .fq7Lz, .defaultDarkTheme .web-tooltip__container.dark
Orange Red

HEX

RGB

HSL

OKLCH

CMYK
0 69 90 0

On text
6.41:1 AA

On white
3.27:1 AA large

Text, background, graphic · .Button__bg, .ab-in-app-message button.ab-message-button
Blue Violet

HEX

RGB

HSL

OKLCH

CMYK
55 97 0 0

On text
3.22:1 AA large

On white
6.52:1 AA

Background, text, border · .defaultDarkTheme .Tbg44 .lefEB button, .defaultDarkTheme .o2Bm4 a button
Orange

HEX

RGB

HSL

OKLCH

CMYK
0 35 80 0

On text
10.65:1 AAA

On white
1.97:1 Fail

Text, background, graphic · .kids-mode .ab-in-app-message button.ab-message-button, .kids-mode .INzaK .jF0Yq
Crimson

HEX

RGB

HSL

OKLCH

CMYK
0 100 69 9

On text
4.52:1 AA

On white
4.64:1 AA

Background, border, text · .defaultDarkTheme .web-label--color-red, .defaultDarkTheme .web-text-input__error
Medium Violet Red

HEX

RGB

HSL

OKLCH

CMYK
0 100 43 12

On text
4.48:1 AA large

On white
4.69:1 AA

Background, border, text · .kidsDarkTheme .web-label--color-red, .kidsDarkTheme .web-text-input__error
Light Black

HEX

RGB

HSL

OKLCH

CMYK
76 0 56 87

On text
1.25:1 Fail

On white
16.85:1 AAA

Background · .b7GIh, .aG9dv

Gradients

linear-gradient(180deg,#53008b,#0b0019 100vh)
linear-gradient(180deg,#1d00f2,#2948ff 100vh)
linear-gradient(0deg,#0b0019,#53008b)

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.

Inter

Aa 100 Aa 900

Inter

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

Aa 200 Aa 900

TubiStans

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

Aa 400

text-security

Self-hosted · weights 400 · shown in a stand-in if you don’t have it

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

Type scale

From the site’s CSS · root 12 px

Heading 1 2em · 24 px

Tubi

Heading 2 24px / 32px weight 900 · TubiStans

Watch Free Movies and TV Shows Online | Tubi

Heading 3 16px / 24px weight 700 · Inter

Watch Free Movies and TV Shows Online | Tubi

Heading 4 14px / 20px weight 400

Watch Free Movies and TV Shows Online | Tubi

Body 12px weight 400 · Inter

Watch free movies and TV shows online in HD on any device. Tubi offers streaming movies in genres like Action, Horror, Sci-Fi, Crime and Co…

Paragraph 16px / 24px weight 500 · Inter

Watch free movies and TV shows online in HD on any device. Tubi offers streaming movies in genres like Action, Horror, Sci-Fi, Crime and Co…

Small 80%

Watch free movies and TV shows online in HD on any device. Tubi offers streaming movies in genres like Action, Horror, Sci-Fi, Crime and Co…

Button 100% / 1.15 none

Get started

Link 14px / 20px weight 500 · Inter

Sizes in use

Most common across the site

36pxline 40px · 50 rules
24pxline 32px · 65 rules
20pxline 24px · 24 rules
18pxline 24px · 30 rules
16pxline 24px · 181 rules
14pxline 20px · 125 rules
12pxline 16px · 29 rules
11pxline 16px · 88 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

.ab-in-app-message button.ab-message-button · #FF501A · radius 2px

Corner radius

999px · 93×
8px · 49×
4px · 48×
50% · 25×
16px · 20×
12px · 20×

Shadows

0 0 0 2px #ffff13
0 0 0 .1333333333rem hsla(0,0%,100%,.2)
0 6px 10px 0 rgba(0,0,0,.05)
0 0 0 2px #0b0019,0 0 0 4px #ffff13

Layout

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

Grid

Breakpoints

539

767

768

959

960

1169

1170

1440

On a scale of 0 to 1440 px.

Content widths (max-width)

1920 px

938 px

870 px

650 px

500 px

480 px

Notes

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

Notes

● FineThe title is 44 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 Tubi use?: Tubi’s website uses three typefaces: Inter (headings and body text), self-hosted; TubiStans, self-hosted; text-security, self-hosted.
What are Tubi’s brand colours?: The main colours on tubitv.com are Deep Black (#0B0019), Yellow (#FFFF13), Blue (#1D00F2), Slate Blue (#2948FF), Indigo (#53008B) and Black (#161324).
What colour is Tubi’s text and background?: Body text is #000000 on a #FFFFFF background.
Where is Tubi’s logo from?: The logo shown in this guide was found on tubitv.com’s homepage. For official logo files and usage rules, check Tubi’s own brand or press page.
Is this Tubi’s official style guide?: No. SiteStyleGuide made it from tubitv.com’s public web pages on 25 October 2026, and isn’t affiliated with Tubi. 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

tubitv-com-tokens.css

Download

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

/* tubitv.com design tokens, from SiteStyleGuide (https://sitestyleguide.com/tubitv.com) */
:root {
  /* Colours */
  --text: #000000;
  --background: #FFFFFF;
  --colour-white: #FFFFFF;
  --colour-black: #000000;
  --colour-cool-charcoal: #26262D;
  --colour-cool-grey: #707C86;
  --colour-deep-black: #0B0019;
  --colour-yellow: #FFFF13;
  --colour-blue: #1D00F2;
  --colour-slate-blue: #2948FF;
  --colour-indigo: #53008B;
  --colour-black-2: #161324;
  --colour-orange-red: #FF501A;
  --colour-blue-violet: #7408FF;
  --colour-orange: #FEA534;
  --colour-crimson: #E80047;
  --colour-medium-violet-red: #E00080;
  --colour-light-black: #08220F;
  --gradient-1: linear-gradient(180deg,#53008b,#0b0019 100vh);
  --gradient-2: linear-gradient(180deg,#1d00f2,#2948ff 100vh);
  --gradient-3: linear-gradient(0deg,#0b0019,#53008b);

  /* Typefaces */
  --font-headings: 'Inter', 'Helvetica Neue', sans-serif;
  --font-buttons: 'Inter', 'Helvetica Neue', sans-serif;
  --font-body: 'Inter', 'Helvetica Neue', sans-serif;
  --font-other: 'text-security', 'Inter', 'Helvetica Neue', sans-serif;

  /* Type scale */
  --text-h1: 2em;
  --text-h2: 24px;
  --leading-h2: 32px;
  --text-h3: 16px;
  --leading-h3: 24px;
  --text-h4: 14px;
  --leading-h4: 20px;
  --text-body: 12px;
  --text-p: 16px;
  --leading-p: 24px;
  --text-small: 80%;
  --text-button: 100%;
  --leading-button: 1.15;
  --text-a: 14px;
  --leading-a: 20px;

  /* Shape */
  --radius-1: 999px;
  --radius-2: 8px;
  --radius-3: 4px;
  --radius-4: 50%;
  --radius-5: 16px;
  --radius-6: 12px;

  /* Layout (breakpoints can’t be used in media queries as variables; they’re here for reference) */
  --breakpoint-1: 539px;
  --breakpoint-2: 767px;
  --breakpoint-3: 768px;
  --breakpoint-4: 959px;
  --breakpoint-5: 960px;
  --breakpoint-6: 1169px;
  --breakpoint-7: 1170px;
  --breakpoint-8: 1440px;
  --max-width-1: 1920px;
  --max-width-2: 938px;
  --max-width-3: 870px;
  --max-width-4: 650px;
  --max-width-5: 500px;
  --max-width-6: 480px;
}

{
    "site": "tubitv.com",
    "source": "https://sitestyleguide.com/tubitv.com",
    "text": "#000000",
    "background": "#FFFFFF",
    "colours": [
        {
            "name": "White",
            "hex": "#FFFFFF",
            "rgb": [
                255,
                255,
                255
            ]
        },
        {
            "name": "Black",
            "hex": "#000000",
            "rgb": [
                0,
                0,
                0
            ]
        },
        {
            "name": "Cool Charcoal",
            "hex": "#26262D",
            "rgb": [
                38,
                38,
                45
            ]
        },
        {
            "name": "Cool Grey",
            "hex": "#707C86",
            "rgb": [
                112,
                124,
                134
            ]
        },
        {
            "name": "Deep Black",
            "hex": "#0B0019",
            "rgb": [
                11,
                0,
                25
            ]
        },
        {
            "name": "Yellow",
            "hex": "#FFFF13",
            "rgb": [
                255,
                255,
                19
            ]
        },
        {
            "name": "Blue",
            "hex": "#1D00F2",
            "rgb": [
                29,
                0,
                242
            ]
        },
        {
            "name": "Slate Blue",
            "hex": "#2948FF",
            "rgb": [
                41,
                72,
                255
            ]
        },
        {
            "name": "Indigo",
            "hex": "#53008B",
            "rgb": [
                83,
                0,
                139
            ]
        },
        {
            "name": "Black",
            "hex": "#161324",
            "rgb": [
                22,
                19,
                36
            ]
        },
        {
            "name": "Orange Red",
            "hex": "#FF501A",
            "rgb": [
                255,
                80,
                26
            ]
        },
        {
            "name": "Blue Violet",
            "hex": "#7408FF",
            "rgb": [
                116,
                8,
                255
            ]
        },
        {
            "name": "Orange",
            "hex": "#FEA534",
            "rgb": [
                254,
                165,
                52
            ]
        },
        {
            "name": "Crimson",
            "hex": "#E80047",
            "rgb": [
                232,
                0,
                71
            ]
        },
        {
            "name": "Medium Violet Red",
            "hex": "#E00080",
            "rgb": [
                224,
                0,
                128
            ]
        },
        {
            "name": "Light Black",
            "hex": "#08220F",
            "rgb": [
                8,
                34,
                15
            ]
        }
    ],
    "fonts": [
        {
            "name": "Inter",
            "stack": "Inter, Helvetica Neue, sans-serif",
            "weights": [
                100,
                400,
                500,
                700,
                900
            ],
            "source": "Self-hosted"
        },
        {
            "name": "TubiStans",
            "stack": "TubiStans, Helvetica Neue, sans-serif",
            "weights": [
                200,
                700,
                900
            ],
            "source": "Self-hosted"
        },
        {
            "name": "text-security",
            "stack": "text-security, Inter, Helvetica Neue, sans-serif",
            "weights": [
                400
            ],
            "source": "Self-hosted"
        }
    ]
}

Other websites using Inter as their main typeface

ITFixio

itfixio.co.uk · set in Inter
Save1
IGN

ign.com · set in Inter
Save
Deezer

deezer.com · set in Inter
Save
AI-Native Cloud

digitalocean.com · set in Inter
Save

Websites whose lead colour is closest to Tubi’s

Outbrain

outbrain.com · 3 days ago
Save
Twilio

segment.com · 6 days ago
Save
expedia

expedia.co.uk · 4 days ago
Save
vrbo

vrbo.com · 4 days ago
Save

Captured from tubitv.com on 25 October 2026. SiteStyleGuide isn’t affiliated with or endorsed by Tubi; this guide describes the public website for reference.

Tubistyle guide

Title &description

Logo

Favicons

Colour

Balance

Neutrals

White

Black

Cool Charcoal

Cool Grey

Colours

Deep Black

Yellow

Blue

Slate Blue

Indigo

Black

Orange Red

Blue Violet

Orange

Crimson

Medium Violet Red

Light Black

Gradients

Inter

Type scale

Sizes in use

Elements

Grid

Notes

Questions

Tokens

Share

Run tubitv.com?

Also set in Inter

ITFixio

IGN

Deezer

AI-Native Cloud

Similar colours

Outbrain

Twilio

expedia

vrbo

Title &
description