What font does snapchat.com use?

The typeface on snapchat.com is Avenir Next, Graphik and SF Mono, loaded across 108 @font-face declarations. Every font family, weight and source on this page is read straight from the live CSS — no image guessing, no machine learning, just the rules the browser used.

Primary font

Avenir Next

Total weights

@font-face

108

Source

Mixed

Avenir Next

Custom web font

The quick brown fox jumps over the lazy dog

Weights loaded (9)

100Typography sets the voice of a brand

200Typography sets the voice of a brand

300Typography sets the voice of a brand

400Typography sets the voice of a brand

500Typography sets the voice of a brand

600Typography sets the voice of a brand

700Typography sets the voice of a brand

800Typography sets the voice of a brand

900Typography sets the voice of a brand

CSS to use Avenir Next

font-family: 'Avenir Next', system-ui, -apple-system, Segoe UI, Roboto, sans-serif;

@font-face source

woff2https://static.snapchat.com/fonts/AvenirNext-UltraLight.woff2

Similar fonts

JostOutfitSpartan

Used by 10 selectors on the page

Graphik

Custom web font

The quick brown fox jumps over the lazy dog

Weights loaded (9)

100Typography sets the voice of a brand

200Typography sets the voice of a brand

300Typography sets the voice of a brand

400Typography sets the voice of a brand

500Typography sets the voice of a brand

600Typography sets the voice of a brand

700Typography sets the voice of a brand

800Typography sets the voice of a brand

900Typography sets the voice of a brand

CSS to use Graphik

font-family: Graphik, Georgia, 'Times New Roman', serif;

@font-face source

woff2https://static.snapchat.com/fonts/Graphik-Thin.woff2

Similar fonts

InterManropeDM Sans

Used by 1 selector on the page

SF Mono

Unknown source

The quick brown fox jumps over the lazy dog

Weights loaded (1)

400Typography sets the voice of a brand

CSS to use SF Mono

font-family: 'SF Mono', ui-monospace, SFMono-Regular, monospace;

Similar fonts

InterManropeDM Sans

Used by 1 selector on the page

How snapchat.com loads its fonts

Get Font Info inspected the homepage of snapchat.com and parsed 2 stylesheets totalling 145.1 KB. Inside those stylesheets we found 108 @font-face declarations — the rules a browser uses to download and register a custom typeface. The primary typefaces are served from mixed, and 45 CSS rules reference them across the page.

Check the font on a specific element

Open the live inspector and hover any text on snapchat.com to see the exact font, weight, size and line-height for that element.

Open live font inspector for snapchat.com

Frequently asked questions

What font does snapchat.com use?

snapchat.com uses Avenir Next, Graphik and SF Mono as its primary typefaces. These fonts are loaded from a self-hosted webfont and an unknown source and applied across 45 CSS rules on the homepage.

Where does snapchat.com load its fonts from?

snapchat.com loads its fonts from a self-hosted webfont and an unknown source. Get Font Info detected 108 @font-face declarations across 2 stylesheets on the live page.

What weights of Avenir Next does snapchat.com use?

snapchat.com loads Avenir Next in 9 weights: 100, 200, 300, 400, 500, 600, 700, 800, 900. If you want to match the look, request the same weights from your font host so you only ship what's actually used.

Can I use the same font as snapchat.com on my website?

Yes — once you know the font name, you can load it from the same source. If Avenir Next isn't a fit (licensing, weight selection, look-and-feel), close alternatives include Jost, Outfit and Spartan. Use the CSS snippet on this page as a starting point.

Is the font on snapchat.com free to use?

These fonts are self-hosted webfonts. They may be licensed commercially from a type foundry, custom-made for the brand, or freely available — you would need to identify the typeface and check its license at the foundry.

See fonts used by other sites

Compare the typography on snapchat.com with how other well-known sites load and use their fonts.

What font does duolingo.com use?What font does nfl.com use?What font does gitlab.com use?What font does wix.com use?What font does svelte.dev use?What font does nodejs.org use?

About this page

This page lists the fonts loaded by the homepage of snapchat.com. Get Font Info reads the live CSS — every @font-face rule, every font-family declaration — so you see the exact fonts the browser used, not an image-based guess.

More guides: how to find fonts on a website, name the font on a website, what font does this website use, or free font checker.