What font does Yahoo! use?

Yahoo!’s website uses four typefaces: YA Sans VF (headings), served from s.yimg.com; Apple Color Emoji (body text), a system font; gelica, self-hosted; centra, self-hosted.

What are Yahoo!’s brand colours?

The main colours on geocities.com are Light Blue Violet (#7D2EFF), Deep Blue Violet (#6B27D9), Light Fire Brick (#C62626), Blue (#6001D2), Sea Green (#017647) and Light Royal Blue (#3265B7).

What colour is Yahoo!’s text and background?

Body text is #1A1919 on a #FFFFFF background.

Where is Yahoo!’s logo from?

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

Is this Yahoo!’s official style guide?

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

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

Unofficial style guide

Yahoo!style guide

Yahoo!’s website (geocities.com) sets its headings in YA Sans VF and its body text in Apple Color Emoji. Its palette is led by Light Blue Violet (#7D2EFF), Deep Blue Violet (#6B27D9) and Light Fire Brick (#C62626), with #1A1919 text on #FFFFFF. Captured from the live site on 2 November 2026.

Website: geocities.com
Typefaces: YA Sans VF, Apple Color Emoji, gelica
Palette: 4 neutrals, 12 colours, 3 gradients
Captured: 2 Nov 2026 · added by @sitestyleguide

Save Add to collection Share Report

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

Screenshot of the geocities.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: Yahoo | Mail, Weather, Search, Politics, News, Finance, Sports & Videos; ▲ 71 / 60 characters
Meta description: Latest news coverage, email, free stock quotes, live scores and video are just the beginning. Discover more every day at Yahoo!; ● 127 / 160 characters
Site name: Yahoo!
og:title: Yahoo | Mail, Weather, Search, Politics, News, Finance, Sports & Videos
og:description: Latest news coverage, email, free stock quotes, live scores and video are just the beginning. Discover more every day at Yahoo!
Language: en-US

In search results

Yahoo!https://www.yahoo.com/

Yahoo | Mail, Weather, Search, Politics, News, Finance, Sport…

Latest news coverage, email, free stock quotes, live scores and video are just the beginning. Discover more every day at Yahoo!

When shared

geocities.com

Yahoo | Mail, Weather, Search, Politics, News, Finance, Sports & Videos

Latest news coverage, email, free stock quotes, live scores and video are just the beginning. Discover more e…

Logo & favicons

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

Logo

On white

On black

On Light Blue Violet

Favicons

2 found

512 px · PNG icon
48 px · PNG icon

Yahoo | Mail, Weather, Search, Politics, News, Finance, Sports & Videos

Light browser tab

Yahoo | Mail, Weather, Search, Politics, News, Finance, Sports & Videos

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

Colour

Balance

How much each colour is used

White 28.2%
Near Black 16.8%
Light Blue Violet 13%
Charcoal 7.3%
Deep Blue Violet 5.3%
Off White 5%
Light Fire Brick 4.1%
Blue 3.7%
Sea Green 2.8%
Light Royal Blue 2.6%
Lavender 2.5%
Deep Fire Brick 2.5%
Sienna 2.3%
Deep Royal Blue 1.9%
Indigo 1.2%
Thistle 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.40:1 AAA

On white
1.01:1 Fail

Background, text, border · body, .bg-elevation-2
Near Black

HEX

RGB

HSL

OKLCH

CMYK
0 4 4 90

On text
—

On white
17.54:1 AAA

Text, border, background · .uds-checkbox-variant-primary-root:is(:disabled,:has(:disabled)).uds-checkbox-va, .\[\&_button\[data-content\]\[data-active\]\]\:text-yn-foreground-primary button
Charcoal

HEX

RGB

HSL

OKLCH

CMYK
0 2 2 77

On text
1.52:1 Fail

On white
11.51:1 AAA

Text, background, graphic · .uds-menuitem-itemcheckbox-variant-default-root.uds-menuitem-itemcheckbox-varian, .uds-banner-variant-brand-secondary-root .uds-banner-variant-brand-secondary-tit
Off White

HEX

RGB

HSL

OKLCH

CMYK
0 0 2 14

On text
12.67:1 AAA

On white
1.38:1 Fail

Background, border, text · .uds-chip-toggle-variant-primary-root:hover:where(:not(:active,:disabled,:has(:d, .uds-chip-toggle-variant-primary-root:active:where(:not(:disabled,:has(:disabled

Colours

Brand colours and accents, most used first

Light Blue Violet

HEX

RGB

HSL

OKLCH

CMYK
51 82 0 0

On text
3.10:1 AA large

On white
5.67:1 AA

Text, background, border · .uds-checkbox-variant-primary-root:is(:disabled,:has(:disabled)).uds-checkbox-va, --tw-ring-color
Deep Blue Violet

HEX

RGB

HSL

OKLCH

CMYK
51 82 0 15

On text
2.44:1 Fail

On white
7.20:1 AAA

Text, background, border · .uds-menuitem-itemcheckbox-variant-default-root:hover:where(:not(:active,:disabl, .uds-menuitem-itemcheckbox-variant-default-root:focus.uds-menuitem-itemcheckbox-
Light Fire Brick

HEX

RGB

HSL

OKLCH

CMYK
0 81 81 22

On text
3.10:1 AA large

On white
5.67:1 AA

Background, text, border · .uds-radio-variant-alert-root:active:where(:not(:disabled,:has(:disabled))).uds-, .uds-radio-variant-alert-root:hover:where(:not(:active,:disabled,:has(:disabled)
Blue

HEX

RGB

HSL

OKLCH

CMYK
54 100 0 18

On text
2.03:1 Fail

On white
8.63:1 AAA

Text, border, graphic · .billBoardTitleHighlight .\[\.billBoardTitleHighlight_\&\]\:border-ymp-uh-grape-, .bg-ymp-uh-grape-jelly
Sea Green

HEX

RGB

HSL

OKLCH

CMYK
99 0 40 54

On text
3.08:1 AA large

On white
5.70:1 AA

Text, background, border · .uds-button-variant-positive-root, .uds-button-variant-positive-root:is(:disabled,:has(:disabled))
Light Royal Blue

HEX

RGB

HSL

OKLCH

CMYK
73 45 0 28

On text
3.08:1 AA large

On white
5.71:1 AA

Text, background · .uds-button-variant-info-root, .uds-button-variant-info-root:is(:disabled,:has(:disabled))
Lavender

HEX

RGB

HSL

OKLCH

CMYK
8 9 0 1

On text
14.31:1 AAA

On white
1.23:1 Fail

Background, border · .uds-chip-toggle-variant-brand-secondary-root:hover:where(:not(:active,:disabled, .uds-chip-toggle-variant-brand-secondary-root:active:where(:not(:disabled,:has(:
Deep Fire Brick

HEX

RGB

HSL

OKLCH

CMYK
0 84 84 33

On text
2.43:1 Fail

On white
7.21:1 AAA

Text, background, border · .uds-radio-variant-alert-secondary-root:hover:where(:not(:active,:disabled,:has(, .uds-button-variant-alert-secondary-root .uds-button-variant-alert-secondary-ico
Sienna

HEX

RGB

HSL

OKLCH

CMYK
0 54 81 35

On text
3.09:1 AA large

On white
5.67:1 AA

Text, background · .uds-button-variant-warning-root, .uds-button-variant-warning-root:is(:disabled,:has(:disabled))
Deep Royal Blue

HEX

RGB

HSL

OKLCH

CMYK
100 53 0 28

On text
2.55:1 Fail

On white
6.87:1 AA

Text, background, graphic · .bg-\[\#0057b8\], .text-\[\#0057b8\]
Indigo

HEX

RGB

HSL

OKLCH

CMYK
51 82 0 39

On text
1.63:1 Fail

On white
10.79:1 AAA

Text, border, graphic · .text-purple-12, .text-purple-13
Thistle

HEX

RGB

HSL

OKLCH

CMYK
11 16 0 0

On text
12.78:1 AAA

On white
1.37:1 Fail

Background, border · .bg-purple-3, .bg-ymp-purple-2

Gradients

linear-gradient(to right,)
linear-gradient(to bottom,)
linear-gradient(to left,)

Dark mode

Switched on by the site

Blue Violet

#7D2EFF
Deep Sky Blue

#12A9FF
Cool Charcoal

#232A31
Off White

#F3F2EF
Medium Purple

#907CFF
Charcoal

#323232
Near Black

#141414
White

#FFFFFF
Near Black

#1F1F1F
Cool Near Black

#101518
Cool Off White

#E0E4E9
Light Grey

#B0B0B0

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.

YA Sans VF

Aa 450 Aa 1000

YA Sans VF

Served from s.yimg.com · weights 450, 500, 600, 1000 · headings, buttons · shown in a stand-in if you don’t have it

Aa 400

Apple Color Emoji

System font, or not loaded on this page · body · shown in a stand-in if you don’t have it

Aa 400

gelica

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

Aa 400 Aa 800

centra

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

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

Type scale

From the site’s CSS

Paragraph 15px / 19px weight 600

Latest news coverage, email, free stock quotes, live scores and video are just the beginning. Discover more every day at Yahoo!

Small 80%

Latest news coverage, email, free stock quotes, live scores and video are just the beginning. Discover more every day at Yahoo!

Button 100% none

Get started

Link —

Sizes in use

Most common across the site

24pxline 2rem · 6 rules
20pxline 20px · 6 rules
18pxline 1.375rem · 8 rules
16pxline 1rem · 25 rules
15pxline 1.375rem · 10 rules
14pxline max(16px,0.9625rem) · 13 rules
13pxline 1rem · 11 rules
12pxline 1rem · 8 rules

Elements

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

Elements

Corner radius

9999px · 96×
.75rem · 12×
.5rem · 10×
calc( + 2px + 2px) · 7×
16px · 6×
1rem · 5×

Shadows

0 0 #0000,0 0 #0000,0 0 #0000
0 0 0 transparent,0 0 0 transparent
0 0 0 2px transparent,0 0 0 calc(2px + 2px) rgb(24 25 26)
0 0 transparent,0 0 transparent,0 0 #0000,0 0 #0000,0 0 #0000

Layout

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

Grid

Breakpoints

320

375

425

640

768

1024

1280

1536

On a scale of 0 to 1536 px.

Content widths (max-width)

1280 px

1024 px

768 px

640 px

375 px

320 px

Notes

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

Notes

▲ CheckThe title is 71 characters. Google usually cuts titles near 60, so the end may not show in results.

Questions

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

Questions

What font does Yahoo! use?: Yahoo!’s website uses four typefaces: YA Sans VF (headings), served from s.yimg.com; Apple Color Emoji (body text), a system font; gelica, self-hosted; centra, self-hosted.
What are Yahoo!’s brand colours?: The main colours on geocities.com are Light Blue Violet (#7D2EFF), Deep Blue Violet (#6B27D9), Light Fire Brick (#C62626), Blue (#6001D2), Sea Green (#017647) and Light Royal Blue (#3265B7).
What colour is Yahoo!’s text and background?: Body text is #1A1919 on a #FFFFFF background.
Where is Yahoo!’s logo from?: The logo shown in this guide was found on geocities.com’s homepage. For official logo files and usage rules, check Yahoo!’s own brand or press page.
Is this Yahoo!’s official style guide?: No. SiteStyleGuide made it from geocities.com’s public web pages on 2 November 2026, and isn’t affiliated with Yahoo!. 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

geocities-com-tokens.css

Download

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

/* geocities.com design tokens, from SiteStyleGuide (https://sitestyleguide.com/geocities.com) */
:root {
  /* Colours */
  --text: #1A1919;
  --background: #FFFFFF;
  --colour-white: #FEFEFE;
  --colour-near-black: #1A1919;
  --colour-charcoal: #3A3939;
  --colour-off-white: #DCDBD8;
  --colour-light-blue-violet: #7D2EFF;
  --colour-deep-blue-violet: #6B27D9;
  --colour-light-fire-brick: #C62626;
  --colour-blue: #6001D2;
  --colour-sea-green: #017647;
  --colour-light-royal-blue: #3265B7;
  --colour-lavender: #EAE5FD;
  --colour-deep-fire-brick: #AB1C1B;
  --colour-sienna: #A64D1F;
  --colour-deep-royal-blue: #0057B8;
  --colour-indigo: #4C1C9B;
  --colour-thistle: #E2D6FF;
  --gradient-1: linear-gradient(to right,);
  --gradient-2: linear-gradient(to bottom,);
  --gradient-3: linear-gradient(to left,);

  /* Typefaces */
  --font-headings: 'YA Sans VF', 'Helvetica Neue', 'Helvetica', 'Arial', sans-serif;
  --font-buttons: 'YA Sans VF', 'Helvetica Neue', 'Helvetica', 'Arial', sans-serif;
  --font-body: ui-sans-serif, system-ui, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol';
  --font-other: 'gelica', 'gelica Fallback';

  /* Type scale */
  --text-p: 15px;
  --leading-p: 19px;
  --text-small: 80%;
  --text-button: 100%;

  /* Shape */
  --radius-1: 9999px;
  --radius-2: .75rem;
  --radius-3: .5rem;
  --radius-4: calc( + 2px + 2px);
  --radius-5: 16px;
  --radius-6: 1rem;

  /* Layout (breakpoints can’t be used in media queries as variables; they’re here for reference) */
  --breakpoint-1: 320px;
  --breakpoint-2: 375px;
  --breakpoint-3: 425px;
  --breakpoint-4: 640px;
  --breakpoint-5: 768px;
  --breakpoint-6: 1024px;
  --breakpoint-7: 1280px;
  --breakpoint-8: 1536px;
  --max-width-1: 1280px;
  --max-width-2: 1024px;
  --max-width-3: 768px;
  --max-width-4: 640px;
  --max-width-5: 375px;
  --max-width-6: 320px;
}

{
    "site": "geocities.com",
    "source": "https://sitestyleguide.com/geocities.com",
    "text": "#1A1919",
    "background": "#FFFFFF",
    "colours": [
        {
            "name": "White",
            "hex": "#FEFEFE",
            "rgb": [
                254,
                254,
                254
            ]
        },
        {
            "name": "Near Black",
            "hex": "#1A1919",
            "rgb": [
                26,
                25,
                25
            ]
        },
        {
            "name": "Charcoal",
            "hex": "#3A3939",
            "rgb": [
                58,
                57,
                57
            ]
        },
        {
            "name": "Off White",
            "hex": "#DCDBD8",
            "rgb": [
                220,
                219,
                216
            ]
        },
        {
            "name": "Light Blue Violet",
            "hex": "#7D2EFF",
            "rgb": [
                125,
                46,
                255
            ]
        },
        {
            "name": "Deep Blue Violet",
            "hex": "#6B27D9",
            "rgb": [
                107,
                39,
                217
            ]
        },
        {
            "name": "Light Fire Brick",
            "hex": "#C62626",
            "rgb": [
                198,
                38,
                38
            ]
        },
        {
            "name": "Blue",
            "hex": "#6001D2",
            "rgb": [
                96,
                1,
                210
            ]
        },
        {
            "name": "Sea Green",
            "hex": "#017647",
            "rgb": [
                1,
                118,
                71
            ]
        },
        {
            "name": "Light Royal Blue",
            "hex": "#3265B7",
            "rgb": [
                50,
                101,
                183
            ]
        },
        {
            "name": "Lavender",
            "hex": "#EAE5FD",
            "rgb": [
                234,
                229,
                253
            ]
        },
        {
            "name": "Deep Fire Brick",
            "hex": "#AB1C1B",
            "rgb": [
                171,
                28,
                27
            ]
        },
        {
            "name": "Sienna",
            "hex": "#A64D1F",
            "rgb": [
                166,
                77,
                31
            ]
        },
        {
            "name": "Deep Royal Blue",
            "hex": "#0057B8",
            "rgb": [
                0,
                87,
                184
            ]
        },
        {
            "name": "Indigo",
            "hex": "#4C1C9B",
            "rgb": [
                76,
                28,
                155
            ]
        },
        {
            "name": "Thistle",
            "hex": "#E2D6FF",
            "rgb": [
                226,
                214,
                255
            ]
        }
    ],
    "fonts": [
        {
            "name": "YA Sans VF",
            "stack": "\"YA Sans VF\", \"Helvetica Neue\", \"Helvetica\", \"Arial\", \"sans-serif\"",
            "weights": [
                450,
                500,
                600,
                1000
            ],
            "source": "Served from s.yimg.com"
        },
        {
            "name": "Apple Color Emoji",
            "stack": "ui-sans-serif, system-ui, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji",
            "weights": [],
            "source": "System font, or not loaded on this page"
        },
        {
            "name": "gelica",
            "stack": "gelica, gelica Fallback",
            "weights": [
                400
            ],
            "source": "Self-hosted"
        },
        {
            "name": "centra",
            "stack": "centra, centra Fallback",
            "weights": [
                400,
                500,
                700,
                800
            ],
            "source": "Self-hosted"
        },
        {
            "name": "yahooSans",
            "stack": "yahooSans, yahooSans Fallback",
            "weights": [
                200,
                900
            ],
            "source": "Self-hosted"
        },
        {
            "name": "Roboto Mono",
            "stack": "\"Roboto Mono\", \"ui-monospace\", \"SFMono-Regular\", \"Menlo\", \"Monaco\", \"Consolas\", \"Liberation Mono\", \"Courier New\", \"monospace\"",
            "weights": [
                100,
                300,
                400,
                500,
                700
            ],
            "source": "Served from s.yimg.com"
        }
    ]
}

Websites whose lead colour is closest to Yahoo!’s

Reinvented with Accenture

accenture.com · 1 day ago
Save
gettyimages.it

gettyimages.it · 4 days ago
Save
gettyimages.es

gettyimages.es · 5 days ago
Save
Deezer

deezer.com · 1 day ago
Save

Captured from geocities.com on 2 November 2026. SiteStyleGuide isn’t affiliated with or endorsed by Yahoo!; this guide describes the public website for reference.

Yahoo!style guide

Title &description

Logo

Favicons

Colour

Balance

Neutrals

White

Near Black

Charcoal

Off White

Colours

Light Blue Violet

Deep Blue Violet

Light Fire Brick

Blue

Sea Green

Light Royal Blue

Lavender

Deep Fire Brick

Sienna

Deep Royal Blue

Indigo

Thistle

Gradients

Dark mode

YA Sans VF

Type scale

Sizes in use

Elements

Grid

Notes

Questions

Tokens

Share

Run geocities.com?

Similar colours

Reinvented with Accenture

gettyimages.it

gettyimages.es

Deezer

Title &
description