Typography
Browse a real free-font catalog for brand and UI work
This page now uses a synced Google Fonts catalog so you can search families, compare categories, copy import code, and jump to download pages without leaving the project workflow.
1929 familiesGoogle Fonts dataSearchable and downloadable
Sans SerifVariable100, 200, 300, 400
Roboto
Design stories feel richer with the right color system.
Roboto works well for sans serif directions and supports subsets like cyrillic, cyrillic-ext, greek, greek-ext.
Christian RobertsonParaTypeFont Bureau
Import snippet
@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;600;700;800&display=swap');
Popularity
#3
Axes
2
Sans SerifVariable300, 400, 500, 600
Open Sans
Design stories feel richer with the right color system.
Open Sans works well for sans serif directions and supports subsets like cyrillic, cyrillic-ext, greek, greek-ext.
Steve Matteson
Import snippet
@import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@300;400;500;600;700;800&display=swap');
Popularity
#4
Axes
2
Sans SerifVariable400, 500, 600, 700
Google Sans
Design stories feel richer with the right color system.
Google Sans works well for sans serif directions and supports subsets like armenian, bengali, canadian-aboriginal, cyrillic.
Google
Import snippet
@import url('https://fonts.googleapis.com/css2?family=Google+Sans:wght@300;400;500;600;700;800&display=swap');
Popularity
#5
Axes
3
Sans SerifVariable100, 200, 300, 400
Inter
Design stories feel richer with the right color system.
Inter works well for sans serif directions and supports subsets like cyrillic, cyrillic-ext, greek, greek-ext.
Rasmus Andersson
Import snippet
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap');
Popularity
#6
Axes
2
Sans SerifVariable100, 200, 300, 400
Montserrat
Design stories feel richer with the right color system.
Montserrat works well for sans serif directions and supports subsets like cyrillic, cyrillic-ext, latin, latin-ext.
Julieta UlanovskySol MatasJuan Pablo del Peral
Import snippet
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@300;400;500;600;700;800&display=swap');
Popularity
#8
Axes
1
Sans SerifStatic100, 200, 300, 400
Poppins
Design stories feel richer with the right color system.
Poppins works well for sans serif directions and supports subsets like devanagari, latin, latin-ext.
Indian Type FoundryJonny PinhornNinad Kale
Import snippet
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700;800&display=swap');
Popularity
#9
Axes
0
Sans SerifStatic100, 300, 400, 700
Lato
Design stories feel richer with the right color system.
Lato works well for sans serif directions and supports subsets like latin, latin-ext.
Łukasz Dziedzic
Import snippet
@import url('https://fonts.googleapis.com/css2?family=Lato:wght@300;400;500;600;700;800&display=swap');
Popularity
#10
Axes
0
Sans SerifVariable100, 200, 300, 400
Noto Sans JP
Design stories feel richer with the right color system.
Noto Sans JP works well for sans serif directions and supports subsets like cyrillic, japanese, latin, latin-ext.
Google
Import snippet
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@300;400;500;600;700;800&display=swap');
Popularity
#11
Axes
1
Sans SerifVariable100, 200, 300, 400
Roboto Condensed
Design stories feel richer with the right color system.
Roboto Condensed works well for sans serif directions and supports subsets like cyrillic, cyrillic-ext, greek, greek-ext.
Christian Robertson
Import snippet
@import url('https://fonts.googleapis.com/css2?family=Roboto+Condensed:wght@300;400;500;600;700;800&display=swap');
Popularity
#15
Axes
1
MonospaceVariable100, 200, 300, 400
Roboto Mono
const accent = 'Roboto Mono';
Roboto Mono works well for monospace directions and supports subsets like cyrillic, cyrillic-ext, greek, latin.
Christian Robertson
Import snippet
@import url('https://fonts.googleapis.com/css2?family=Roboto+Mono:wght@300;400;500;600;700;800&display=swap');
Popularity
#17
Axes
1
Sans SerifVariable100, 200, 300, 400
Noto Sans
Design stories feel richer with the right color system.
Noto Sans works well for sans serif directions and supports subsets like cyrillic, cyrillic-ext, devanagari, greek.
Google
Import snippet
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans:wght@300;400;500;600;700;800&display=swap');
Popularity
#18
Axes
2
Sans SerifVariable200, 300, 400, 500
Oswald
Design stories feel richer with the right color system.
Oswald works well for sans serif directions and supports subsets like cyrillic, cyrillic-ext, latin, latin-ext.
Vernon AdamsKalapi GajjarCyreal
Import snippet
@import url('https://fonts.googleapis.com/css2?family=Oswald:wght@300;400;500;600;700;800&display=swap');
Popularity
#19
Axes
1
Sans SerifVariable400, 500, 600, 700
Arimo
Design stories feel richer with the right color system.
Arimo works well for sans serif directions and supports subsets like cyrillic, cyrillic-ext, greek, greek-ext.
Steve Matteson
Import snippet
@import url('https://fonts.googleapis.com/css2?family=Arimo:wght@300;400;500;600;700;800&display=swap');
Popularity
#21
Axes
1
Sans SerifVariable100, 200, 300, 400
Raleway
Design stories feel richer with the right color system.
Raleway works well for sans serif directions and supports subsets like cyrillic, cyrillic-ext, latin, latin-ext.
Matt McInerneyPablo ImpallariRodrigo Fuenzalida
Import snippet
@import url('https://fonts.googleapis.com/css2?family=Raleway:wght@300;400;500;600;700;800&display=swap');
Popularity
#23
Axes
1
Sans SerifVariable200, 300, 400, 500
Nunito
Design stories feel richer with the right color system.
Nunito works well for sans serif directions and supports subsets like cyrillic, cyrillic-ext, latin, latin-ext.
Vernon AdamsCyrealJacques Le Bailly
Import snippet
@import url('https://fonts.googleapis.com/css2?family=Nunito:wght@300;400;500;600;700;800&display=swap');
Popularity
#24
Axes
1
Sans SerifVariable100, 200, 300, 400
DM Sans
Design stories feel richer with the right color system.
DM Sans works well for sans serif directions and supports subsets like latin, latin-ext.
Colophon Foundry
Import snippet
@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@300;400;500;600;700;800&display=swap');
Popularity
#25
Axes
2
Sans SerifVariable200, 300, 400, 500
Nunito Sans
Design stories feel richer with the right color system.
Nunito Sans works well for sans serif directions and supports subsets like cyrillic, cyrillic-ext, latin, latin-ext.
Vernon AdamsJacques Le BaillyManvel Shmavonyan
Import snippet
@import url('https://fonts.googleapis.com/css2?family=Nunito+Sans:wght@300;400;500;600;700;800&display=swap');
Popularity
#26
Axes
4
SerifVariable400, 500, 600, 700
Playfair Display
Design stories feel richer with the right color system.
Playfair Display works well for serif directions and supports subsets like cyrillic, latin, latin-ext, vietnamese.
Claus Eggers Sørensen
Import snippet
@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:wght@300;400;500;600;700;800&display=swap');
Popularity
#27
Axes
1
Sans SerifVariable300, 400, 500, 600
Rubik
Design stories feel richer with the right color system.
Rubik works well for sans serif directions and supports subsets like arabic, cyrillic, cyrillic-ext, hebrew.
Hubert and FischerMeir SadanCyreal
Import snippet
@import url('https://fonts.googleapis.com/css2?family=Rubik:wght@300;400;500;600;700;800&display=swap');
Popularity
#28
Axes
1
Sans SerifStatic300, 400, 500, 700
Ubuntu
Design stories feel richer with the right color system.
Ubuntu works well for sans serif directions and supports subsets like cyrillic, cyrillic-ext, greek, greek-ext.
Dalton Maag
Import snippet
@import url('https://fonts.googleapis.com/css2?family=Ubuntu:wght@300;400;500;600;700;800&display=swap');
Popularity
#29
Axes
0
SerifVariable100, 200, 300, 400
Roboto Slab
Design stories feel richer with the right color system.
Roboto Slab works well for serif directions and supports subsets like cyrillic, cyrillic-ext, greek, greek-ext.
Christian Robertson
Import snippet
@import url('https://fonts.googleapis.com/css2?family=Roboto+Slab:wght@300;400;500;600;700;800&display=swap');
Popularity
#30
Axes
1
Sans SerifVariable100, 200, 300, 400
Noto Sans KR
Design stories feel richer with the right color system.
Noto Sans KR works well for sans serif directions and supports subsets like cyrillic, korean, latin, latin-ext.
Google
Import snippet
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@300;400;500;600;700;800&display=swap');
Popularity
#31
Axes
1
SerifVariable300, 400, 500, 600
Merriweather
Design stories feel richer with the right color system.
Merriweather works well for serif directions and supports subsets like cyrillic, cyrillic-ext, latin, latin-ext.
Sorkin Type
Import snippet
@import url('https://fonts.googleapis.com/css2?family=Merriweather:wght@300;400;500;600;700;800&display=swap');
Popularity
#33
Axes
3
Sans SerifVariable100, 200, 300, 400
Work Sans
Design stories feel richer with the right color system.
Work Sans works well for sans serif directions and supports subsets like latin, latin-ext, vietnamese.
Wei Huang
Import snippet
@import url('https://fonts.googleapis.com/css2?family=Work+Sans:wght@300;400;500;600;700;800&display=swap');
Popularity
#35
Axes
1
Sans SerifStatic400, 700, 400i, 700i
PT Sans
Design stories feel richer with the right color system.
PT Sans works well for sans serif directions and supports subsets like cyrillic, cyrillic-ext, latin, latin-ext.
ParaType
Import snippet
@import url('https://fonts.googleapis.com/css2?family=PT+Sans:wght@300;400;500;600;700;800&display=swap');
Popularity
#36
Axes
0
Sans SerifVariable200, 300, 400, 500
Manrope
Design stories feel richer with the right color system.
Manrope works well for sans serif directions and supports subsets like cyrillic, cyrillic-ext, greek, latin.
Mikhail Sharanda
Import snippet
@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@300;400;500;600;700;800&display=swap');
Popularity
#37
Axes
1
Sans SerifStatic400
Archivo Black
Design stories feel richer with the right color system.
Archivo Black works well for sans serif directions and supports subsets like latin, latin-ext.
Omnibus-Type
Import snippet
@import url('https://fonts.googleapis.com/css2?family=Archivo+Black:wght@300;400;500;600;700;800&display=swap');
Popularity
#38
Axes
0
Sans SerifVariable100, 200, 300, 400
Outfit
Design stories feel richer with the right color system.
Outfit works well for sans serif directions and supports subsets like latin, latin-ext.
Smartsheet IncRodrigo Fuenzalida
Import snippet
@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500;600;700;800&display=swap');
Popularity
#39
Axes
1
Sans SerifStatic100, 200, 300, 400
Kanit
Design stories feel richer with the right color system.
Kanit works well for sans serif directions and supports subsets like latin, latin-ext, thai, vietnamese.
Cadson Demak
Import snippet
@import url('https://fonts.googleapis.com/css2?family=Kanit:wght@300;400;500;600;700;800&display=swap');
Popularity
#40
Axes
0
Sans SerifVariable300, 400, 500, 600
Quicksand
Design stories feel richer with the right color system.
Quicksand works well for sans serif directions and supports subsets like latin, latin-ext, vietnamese.
Andrew Paglinawan
Import snippet
@import url('https://fonts.googleapis.com/css2?family=Quicksand:wght@300;400;500;600;700;800&display=swap');
Popularity
#41
Axes
1
Sans SerifVariable200, 300, 400, 500
Mulish
Design stories feel richer with the right color system.
Mulish works well for sans serif directions and supports subsets like cyrillic, cyrillic-ext, latin, latin-ext.
Vernon AdamsCyrealJacques Le Bailly
Import snippet
@import url('https://fonts.googleapis.com/css2?family=Mulish:wght@300;400;500;600;700;800&display=swap');
Popularity
#42
Axes
1
SerifVariable400, 500, 600, 700
Lora
Design stories feel richer with the right color system.
Lora works well for serif directions and supports subsets like cyrillic, cyrillic-ext, latin, latin-ext.
Cyreal
Import snippet
@import url('https://fonts.googleapis.com/css2?family=Lora:wght@300;400;500;600;700;800&display=swap');
Popularity
#43
Axes
1
Sans SerifVariable100, 200, 300, 400
Noto Sans TC
Design stories feel richer with the right color system.
Noto Sans TC works well for sans serif directions and supports subsets like chinese-traditional, cyrillic, latin, latin-ext.
Google
Import snippet
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+TC:wght@300;400;500;600;700;800&display=swap');
Popularity
#44
Axes
1
MonospaceVariable200, 300, 400, 500
Inconsolata
const accent = 'Inconsolata';
Inconsolata works well for monospace directions and supports subsets like latin, latin-ext, vietnamese.
Raph Levien
Import snippet
@import url('https://fonts.googleapis.com/css2?family=Inconsolata:wght@300;400;500;600;700;800&display=swap');
Popularity
#45
Axes
2
Sans SerifVariable300, 400, 500, 600
Figtree
Design stories feel richer with the right color system.
Figtree works well for sans serif directions and supports subsets like latin, latin-ext.
Erik Kennedy
Import snippet
@import url('https://fonts.googleapis.com/css2?family=Figtree:wght@300;400;500;600;700;800&display=swap');
Popularity
#46
Axes
1
Sans SerifStatic400
Fjalla One
Design stories feel richer with the right color system.
Fjalla One works well for sans serif directions and supports subsets like cyrillic-ext, latin, latin-ext, vietnamese.
Sorkin TypeIrina Smirnova
Import snippet
@import url('https://fonts.googleapis.com/css2?family=Fjalla+One:wght@300;400;500;600;700;800&display=swap');
Popularity
#47
Axes
0
Sans SerifStatic100, 200, 300, 400
Barlow
Design stories feel richer with the right color system.
Barlow works well for sans serif directions and supports subsets like latin, latin-ext, vietnamese.
Jeremy Tribby
Import snippet
@import url('https://fonts.googleapis.com/css2?family=Barlow:wght@300;400;500;600;700;800&display=swap');
Popularity
#48
Axes
0
Sans SerifStatic400
Bebas Neue
Design stories feel richer with the right color system.
Bebas Neue works well for sans serif directions and supports subsets like latin, latin-ext.
Ryoichi Tsunekawa
Import snippet
@import url('https://fonts.googleapis.com/css2?family=Bebas+Neue:wght@300;400;500;600;700;800&display=swap');
Popularity
#49
Axes
0
Sans SerifVariable200, 300, 400, 500
Source Sans 3
Design stories feel richer with the right color system.
Source Sans 3 works well for sans serif directions and supports subsets like cyrillic, cyrillic-ext, greek, greek-ext.
Paul D. Hunt
Import snippet
@import url('https://fonts.googleapis.com/css2?family=Source+Sans+3:wght@300;400;500;600;700;800&display=swap');
Popularity
#50
Axes
1
Sans SerifStatic100, 200, 300, 400
Fira Sans
Design stories feel richer with the right color system.
Fira Sans works well for sans serif directions and supports subsets like cyrillic, cyrillic-ext, greek, greek-ext.
Carrois Apostrophe
Import snippet
@import url('https://fonts.googleapis.com/css2?family=Fira+Sans:wght@300;400;500;600;700;800&display=swap');
Popularity
#51
Axes
0
Sans SerifVariable100, 200, 300, 400
IBM Plex Sans
Design stories feel richer with the right color system.
IBM Plex Sans works well for sans serif directions and supports subsets like cyrillic, cyrillic-ext, greek, latin.
Mike AbbinkBold Monday
Import snippet
@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans:wght@300;400;500;600;700;800&display=swap');
Popularity
#52
Axes
2
Sans SerifStatic100, 200, 300, 400
Prompt
Design stories feel richer with the right color system.
Prompt works well for sans serif directions and supports subsets like latin, latin-ext, thai, vietnamese.
Cadson Demak
Import snippet
@import url('https://fonts.googleapis.com/css2?family=Prompt:wght@300;400;500;600;700;800&display=swap');
Popularity
#54
Axes
0
Sans SerifStatic200, 300, 400, 600
Titillium Web
Design stories feel richer with the right color system.
Titillium Web works well for sans serif directions and supports subsets like latin, latin-ext.
Accademia di Belle Arti di Urbino
Import snippet
@import url('https://fonts.googleapis.com/css2?family=Titillium+Web:wght@300;400;500;600;700;800&display=swap');
Popularity
#56
Axes
0
Sans SerifVariable100, 200, 300, 400
Saira
Design stories feel richer with the right color system.
Saira works well for sans serif directions and supports subsets like latin, latin-ext, vietnamese.
Omnibus-Type
Import snippet
@import url('https://fonts.googleapis.com/css2?family=Saira:wght@300;400;500;600;700;800&display=swap');
Popularity
#57
Axes
2
Sans SerifVariable200, 300, 400, 500
Plus Jakarta Sans
Design stories feel richer with the right color system.
Plus Jakarta Sans works well for sans serif directions and supports subsets like cyrillic-ext, latin, latin-ext, vietnamese.
Tokotype
Import snippet
@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@300;400;500;600;700;800&display=swap');
Popularity
#58
Axes
1
Sans SerifVariable200, 300, 400, 500
Karla
Design stories feel richer with the right color system.
Karla works well for sans serif directions and supports subsets like latin, latin-ext.
Jonny Pinhorn
Import snippet
@import url('https://fonts.googleapis.com/css2?family=Karla:wght@300;400;500;600;700;800&display=swap');
Popularity
#59
Axes
1
SerifVariable100, 200, 300, 400
Noto Serif
Design stories feel richer with the right color system.
Noto Serif works well for serif directions and supports subsets like cyrillic, cyrillic-ext, greek, greek-ext.
Google
Import snippet
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif:wght@300;400;500;600;700;800&display=swap');
Popularity
#60
Axes
2
Sans SerifVariable100, 200, 300, 400
Jost
Design stories feel richer with the right color system.
Jost works well for sans serif directions and supports subsets like cyrillic, latin, latin-ext.
Owen Earl
Import snippet
@import url('https://fonts.googleapis.com/css2?family=Jost:wght@300;400;500;600;700;800&display=swap');
Popularity
#61
Axes
1