# FontFYI > Comprehensive font reference for developers and designers. 1,925 Google Fonts with AI-powered pairing recommendations, font comparisons, CSS generation tools, typography glossary, and use-case guides. Free JSON API, no auth required. ## Data Scope - 1,925 fonts from Google Fonts, GitHub, and custom sources - 14 curated font pairings with AI-generated rationale - 30 font tags (mood/style classification) - 5 categories: Sans Serif, Serif, Display, Handwriting, Monospace - 14 subcategories/styles: Geometric Sans, Humanist Sans, Neo-grotesque, Slab Serif, etc. - 83 typography glossary terms across 8 categories - 110 blog posts on typography guides and font reviews - 10 interactive tools (pairing generator, type scale, CSS generator, etc.) - 17 use-case guides (resume, blog, e-commerce, mobile app, etc.) - Available in 15 languages ## URL Patterns - Append `.md` to any URL for plain-text markdown format. - i18n: URL prefix `/{lang}` for non-English (ko, ja, zh-hans, es, pt, fr, de, ru, ar, hi, th, vi, id, tr). - `/font/{slug}/` — Font detail page (e.g. `/font/inter/`) - `/font/{slug}/download/` — Font download page (e.g. `/font/inter/download/`) - `/font/{slug}/pairings/` — Font pairings page (e.g. `/font/inter/pairings/`) - `/compare/{font1}-vs-{font2}/` — Font comparison (2 fonts) (e.g. `/compare/inter-vs-roboto/`) - `/compare/{font1}-vs-{font2}-vs-{font3}/` — Font comparison (3 fonts) (e.g. `/compare/inter-vs-roboto-vs-poppins/`) - `/pairings/` — All font pairings (e.g. `/pairings/`) - `/pairings/{slug}/` — Pairing detail (e.g. `/pairings/inter-plus-merriweather/`) - `/category/{slug}/` — Category page (e.g. `/category/sans-serif/`) - `/style/{slug}/` — Subcategory/style page (e.g. `/style/geometric-sans/`) - `/tag/{slug}/` — Font tag page (e.g. `/tag/modern/`) - `/designer/{slug}/` — Designer page (e.g. `/designer/google/`) - `/fonts/{slug}/` — Language/script fonts (e.g. `/fonts/korean/`) - `/use-case/{slug}/` — Use-case recommendation (e.g. `/use-case/resume/`) - `/glossary/{slug}/` — Glossary term detail (e.g. `/glossary/kerning/`) - `/blog/{slug}/` — Blog post (e.g. `/blog/complete-guide-font-pairing/`) - `/tools/{slug}/` — Interactive tool (e.g. `/tools/css-generator/`) ## Browse Fonts - [All Fonts — Popular](https://fontfyi.com/popular/) - [Trending Fonts](https://fontfyi.com/trending/) - [Recently Added](https://fontfyi.com/new/) - [Sans Serif](https://fontfyi.com/category/sans-serif/) - [Serif](https://fontfyi.com/category/serif/) - [Display](https://fontfyi.com/category/display/) - [Handwriting](https://fontfyi.com/category/handwriting/) - [Monospace](https://fontfyi.com/category/monospace/) - [Font Tags](https://fontfyi.com/tag/) - [Designers](https://fontfyi.com/designer/) - [Language/Script Fonts](https://fontfyi.com/fonts/) ## Font Pairings - [All Pairings](https://fontfyi.com/pairings/) - [Inter Pairings](https://fontfyi.com/font/inter/pairings/) - [Roboto Pairings](https://fontfyi.com/font/roboto/pairings/) ## Comparisons - [Compare Fonts](https://fontfyi.com/compare/) - [Inter vs Roboto](https://fontfyi.com/compare/inter-vs-roboto/) - [Inter vs Poppins](https://fontfyi.com/compare/inter-vs-poppins/) ## Tools - [Font Pairing Generator](https://fontfyi.com/tools/pairing-generator/) - [Font Preview](https://fontfyi.com/tools/preview/) - [Font Compare](https://fontfyi.com/tools/compare/) - [Type Scale Calculator](https://fontfyi.com/tools/type-scale/) - [Font Stack Builder](https://fontfyi.com/tools/font-stack/) - [CSS Code Generator](https://fontfyi.com/tools/css-generator/) - [WCAG Contrast Checker](https://fontfyi.com/tools/contrast-checker/) - [Fluid Type Calculator](https://fontfyi.com/tools/fluid-type/) - [px / rem / em Converter](https://fontfyi.com/tools/px-converter/) - [Variable Font Playground](https://fontfyi.com/tools/variable-playground/) ## Use Cases - [All Use Cases](https://fontfyi.com/use-case/) - [Best Fonts for Resume](https://fontfyi.com/use-case/resume/) - [Best Fonts for Blog](https://fontfyi.com/use-case/blog/) - [Best Fonts for Landing Page](https://fontfyi.com/use-case/landing-page/) - [Best Fonts for E-commerce](https://fontfyi.com/use-case/e-commerce/) ## Learn - [Typography Glossary](https://fontfyi.com/glossary/) - [Blog — Typography Guides](https://fontfyi.com/blog/) - [About FontFYI](https://fontfyi.com/about/) ## Embed Widget - [FontFYI Widget Docs](https://widget.fontfyi.com) - [fontfyi-embed on npm](https://www.npmjs.com/package/fontfyi-embed) - [fontfyi-embed on GitHub](https://github.com/fyipedia/fontfyi-embed) ## REST API Free JSON API, no authentication, CORS enabled. | Method | Endpoint | Description | |--------|----------|-------------| | GET | `/api/v1/fonts/` | List all fonts (filterable by category, source, is_variable) | | GET | `/api/v1/fonts/{slug}/` | Font detail with metadata, weights, subsets | | GET | `/api/v1/pairings/` | List font pairings | | GET | `/api/v1/pairings/{slug}/` | Pairing detail with rationale and score | | GET | `/api/v1/tags/` | List font tags (mood/style) | | GET | `/api/v1/tags/{slug}/` | Tag detail | | GET | `/api/v1/glossary/` | List typography glossary terms | | GET | `/api/v1/glossary/{slug}/` | Glossary term detail | | GET | `/api/v1/blog-posts/` | List published blog posts | | GET | `/api/v1/blog-posts/{slug}/` | Blog post detail | | GET | `/api/v1/tools/` | List interactive tools | | GET | `/api/v1/faqs/` | List published FAQs | | GET | `/api/v1/search/` | Search across fonts, glossary, and blog | | GET | `/api/v1/stats/` | Counts for all entity types | | GET | `/api/font/{slug}/` | Font info JSON (legacy) | | GET | `/api/font/{slug}/css/` | CSS @import code for a font | | GET | `/api/search/?q={query}` | Search fonts (legacy) | ```bash curl -s "https://fontfyi.com/api/v1/fonts/inter/" ``` [API Docs](https://fontfyi.com/developers/) · [OpenAPI Spec](https://fontfyi.com/api/openapi.json) ## Developer Tools - **PyPI**: `pip install fontfyi` — [fontfyi](https://pypi.org/project/fontfyi/) — Google Fonts metadata & CSS generation — Python library - **npm**: `npm install fontfyi` — [fontfyi](https://www.npmjs.com/package/fontfyi) — Google Fonts metadata & CSS generation — JavaScript/TypeScript - **Embed Widget**: [fontfyi-embed](https://widget.fontfyi.com) ## Creative FYI Family Part of [FYIPedia](https://fyipedia.com) developer tools ecosystem. - [ColorFYI](https://colorfyi.com) — Color science, WCAG contrast, 16.7M hex colors - [EmojiFYI](https://emojifyi.com) — 3,953 emojis, Unicode Emoji 16.0, 8 encodings - [SymbolFYI](https://symbolfyi.com) — Symbol encoding in 11 formats, Unicode properties - [UnicodeFYI](https://unicodefyi.com) — Unicode characters, 17 encodings, HTML entities ## Images (CDN) OG images for all fonts are available on the R2 CDN. - https://cdn.fontfyi.com/og/inter.png - https://cdn.fontfyi.com/og/roboto.png ## Fonts (Top 200 by Popularity) - [Roboto (sans-serif)](https://fontfyi.com/font/roboto/) - [Open Sans (sans-serif)](https://fontfyi.com/font/open-sans/) - [Google Sans (sans-serif)](https://fontfyi.com/font/google-sans/) - [Noto Sans JP (sans-serif)](https://fontfyi.com/font/noto-sans-jp/) - [Inter (sans-serif)](https://fontfyi.com/font/inter/) - [Montserrat (sans-serif)](https://fontfyi.com/font/montserrat/) - [Poppins (sans-serif)](https://fontfyi.com/font/poppins/) - [Lato (sans-serif)](https://fontfyi.com/font/lato/) - [Roboto Condensed (sans-serif)](https://fontfyi.com/font/roboto-condensed/) - [Roboto Mono (monospace)](https://fontfyi.com/font/roboto-mono/) - [Arimo (sans-serif)](https://fontfyi.com/font/arimo/) - [Oswald (sans-serif)](https://fontfyi.com/font/oswald/) - [Noto Sans (sans-serif)](https://fontfyi.com/font/noto-sans/) - [Raleway (sans-serif)](https://fontfyi.com/font/raleway/) - [Nunito (sans-serif)](https://fontfyi.com/font/nunito/) - [Nunito Sans (sans-serif)](https://fontfyi.com/font/nunito-sans/) - [Playfair Display (serif)](https://fontfyi.com/font/playfair-display/) - [Rubik (sans-serif)](https://fontfyi.com/font/rubik/) - [Ubuntu (sans-serif)](https://fontfyi.com/font/ubuntu/) - [DM Sans (sans-serif)](https://fontfyi.com/font/dm-sans/) - [Roboto Slab (serif)](https://fontfyi.com/font/roboto-slab/) - [Noto Sans KR (sans-serif)](https://fontfyi.com/font/noto-sans-kr/) - [Merriweather (serif)](https://fontfyi.com/font/merriweather/) - [Work Sans (sans-serif)](https://fontfyi.com/font/work-sans/) - [PT Sans (sans-serif)](https://fontfyi.com/font/pt-sans/) - [Lora (serif)](https://fontfyi.com/font/lora/) - [Mulish (sans-serif)](https://fontfyi.com/font/mulish/) - [Kanit (sans-serif)](https://fontfyi.com/font/kanit/) - [Manrope (sans-serif)](https://fontfyi.com/font/manrope/) - [Quicksand (sans-serif)](https://fontfyi.com/font/quicksand/) - [Archivo Black (sans-serif)](https://fontfyi.com/font/archivo-black/) - [Archivo (sans-serif)](https://fontfyi.com/font/archivo/) - [Noto Sans TC (sans-serif)](https://fontfyi.com/font/noto-sans-tc/) - [Outfit (sans-serif)](https://fontfyi.com/font/outfit/) - [Inconsolata (monospace)](https://fontfyi.com/font/inconsolata/) - [Figtree (sans-serif)](https://fontfyi.com/font/figtree/) - [IBM Plex Sans (sans-serif)](https://fontfyi.com/font/ibm-plex-sans/) - [Fira Sans (sans-serif)](https://fontfyi.com/font/fira-sans/) - [Bebas Neue (sans-serif)](https://fontfyi.com/font/bebas-neue/) - [Prompt (sans-serif)](https://fontfyi.com/font/prompt/) - [Barlow (sans-serif)](https://fontfyi.com/font/barlow/) - [Bricolage Grotesque (sans-serif)](https://fontfyi.com/font/bricolage-grotesque/) - [Source Sans 3 (sans-serif)](https://fontfyi.com/font/source-sans-3/) - [Titillium Web (sans-serif)](https://fontfyi.com/font/titillium-web/) - [Saira (sans-serif)](https://fontfyi.com/font/saira/) - [Noto Serif (serif)](https://fontfyi.com/font/noto-serif/) - [Karla (sans-serif)](https://fontfyi.com/font/karla/) - [Heebo (sans-serif)](https://fontfyi.com/font/heebo/) - [Jost (sans-serif)](https://fontfyi.com/font/jost/) - [Bungee (display)](https://fontfyi.com/font/bungee/) - [PT Serif (serif)](https://fontfyi.com/font/pt-serif/) - [Fjalla One (sans-serif)](https://fontfyi.com/font/fjalla-one/) - [Share Tech (sans-serif)](https://fontfyi.com/font/share-tech/) - [Smooch Sans (sans-serif)](https://fontfyi.com/font/smooch-sans/) - [Hind Siliguri (sans-serif)](https://fontfyi.com/font/hind-siliguri/) - [Plus Jakarta Sans (sans-serif)](https://fontfyi.com/font/plus-jakarta-sans/) - [Noto Color Emoji (sans-serif)](https://fontfyi.com/font/noto-color-emoji/) - [Libre Baskerville (serif)](https://fontfyi.com/font/libre-baskerville/) - [Source Code Pro (monospace)](https://fontfyi.com/font/source-code-pro/) - [Dancing Script (handwriting)](https://fontfyi.com/font/dancing-script/) - [Cairo (sans-serif)](https://fontfyi.com/font/cairo/) - [EB Garamond (serif)](https://fontfyi.com/font/eb-garamond/) - [Josefin Sans (sans-serif)](https://fontfyi.com/font/josefin-sans/) - [Noto Serif JP (serif)](https://fontfyi.com/font/noto-serif-jp/) - [Libre Franklin (sans-serif)](https://fontfyi.com/font/libre-franklin/) - [Gravitas One (display)](https://fontfyi.com/font/gravitas-one/) - [Noto Sans SC (sans-serif)](https://fontfyi.com/font/noto-sans-sc/) - [Public Sans (sans-serif)](https://fontfyi.com/font/public-sans/) - [Nanum Gothic (sans-serif)](https://fontfyi.com/font/nanum-gothic/) - [Schibsted Grotesk (sans-serif)](https://fontfyi.com/font/schibsted-grotesk/) - [Dosis (sans-serif)](https://fontfyi.com/font/dosis/) - [Anton (sans-serif)](https://fontfyi.com/font/anton/) - [Barlow Condensed (sans-serif)](https://fontfyi.com/font/barlow-condensed/) - [Bitter (serif)](https://fontfyi.com/font/bitter/) - [Cabin (sans-serif)](https://fontfyi.com/font/cabin/) - [Changa One (display)](https://fontfyi.com/font/changa-one/) - [Roboto Flex (sans-serif)](https://fontfyi.com/font/roboto-flex/) - [Space Grotesk (sans-serif)](https://fontfyi.com/font/space-grotesk/) - [Assistant (sans-serif)](https://fontfyi.com/font/assistant/) - [Alfa Slab One (display)](https://fontfyi.com/font/alfa-slab-one/) - [Mukta (sans-serif)](https://fontfyi.com/font/mukta/) - [Pacifico (handwriting)](https://fontfyi.com/font/pacifico/) - [Lobster Two (display)](https://fontfyi.com/font/lobster-two/) - [Ramabhadra (sans-serif)](https://fontfyi.com/font/ramabhadra/) - [Noto Sans Telugu (sans-serif)](https://fontfyi.com/font/noto-sans-telugu/) - [Hind (sans-serif)](https://fontfyi.com/font/hind/) - [Lexend (sans-serif)](https://fontfyi.com/font/lexend/) - [Red Hat Display (sans-serif)](https://fontfyi.com/font/red-hat-display/) - [Anek Telugu (sans-serif)](https://fontfyi.com/font/anek-telugu/) - [M PLUS Rounded 1c (sans-serif)](https://fontfyi.com/font/m-plus-rounded-1c/) - [Exo 2 (sans-serif)](https://fontfyi.com/font/exo-2/) - [Oxygen (sans-serif)](https://fontfyi.com/font/oxygen/) - [Lobster (display)](https://fontfyi.com/font/lobster/) - [Urbanist (sans-serif)](https://fontfyi.com/font/urbanist/) - [Slabo 27px (serif)](https://fontfyi.com/font/slabo-27px/) - [Cormorant Garamond (serif)](https://fontfyi.com/font/cormorant-garamond/) - [Sora (sans-serif)](https://fontfyi.com/font/sora/) - [Caveat (handwriting)](https://fontfyi.com/font/caveat/) - [Overpass (sans-serif)](https://fontfyi.com/font/overpass/) - [Crimson Text (serif)](https://fontfyi.com/font/crimson-text/) - [Inter Tight (sans-serif)](https://fontfyi.com/font/inter-tight/) - [Comfortaa (display)](https://fontfyi.com/font/comfortaa/) - [Tajawal (sans-serif)](https://fontfyi.com/font/tajawal/) - [Rajdhani (sans-serif)](https://fontfyi.com/font/rajdhani/) - [Arvo (serif)](https://fontfyi.com/font/arvo/) - [DM Serif Display (serif)](https://fontfyi.com/font/dm-serif-display/) - [PT Sans Narrow (sans-serif)](https://fontfyi.com/font/pt-sans-narrow/) - [Noto Sans Arabic (sans-serif)](https://fontfyi.com/font/noto-sans-arabic/) - [Abel (sans-serif)](https://fontfyi.com/font/abel/) - [Almarai (sans-serif)](https://fontfyi.com/font/almarai/) - [Source Serif 4 (serif)](https://fontfyi.com/font/source-serif-4/) - [Teko (sans-serif)](https://fontfyi.com/font/teko/) - [M PLUS 1p (sans-serif)](https://fontfyi.com/font/m-plus-1p/) - [Satisfy (handwriting)](https://fontfyi.com/font/satisfy/) - [Lexend Deca (sans-serif)](https://fontfyi.com/font/lexend-deca/) - [Merriweather Sans (sans-serif)](https://fontfyi.com/font/merriweather-sans/) - [IBM Plex Mono (monospace)](https://fontfyi.com/font/ibm-plex-mono/) - [Domine (serif)](https://fontfyi.com/font/domine/) - [Shadows Into Light (handwriting)](https://fontfyi.com/font/shadows-into-light/) - [Noto Sans Thai (sans-serif)](https://fontfyi.com/font/noto-sans-thai/) - [Barlow Semi Condensed (sans-serif)](https://fontfyi.com/font/barlow-semi-condensed/) - [Orbitron (sans-serif)](https://fontfyi.com/font/orbitron/) - [Instrument Serif (serif)](https://fontfyi.com/font/instrument-serif/) - [Cinzel (serif)](https://fontfyi.com/font/cinzel/) - [Indie Flower (handwriting)](https://fontfyi.com/font/indie-flower/) - [Maven Pro (sans-serif)](https://fontfyi.com/font/maven-pro/) - [JetBrains Mono (monospace)](https://fontfyi.com/font/jetbrains-mono/) - [Lilita One (display)](https://fontfyi.com/font/lilita-one/) - [Asap (sans-serif)](https://fontfyi.com/font/asap/) - [Questrial (sans-serif)](https://fontfyi.com/font/questrial/) - [Fredoka (sans-serif)](https://fontfyi.com/font/fredoka/) - [Play (sans-serif)](https://fontfyi.com/font/play/) - [Varela Round (sans-serif)](https://fontfyi.com/font/varela-round/) - [Google Sans Flex (sans-serif)](https://fontfyi.com/font/google-sans-flex/) - [Abril Fatface (display)](https://fontfyi.com/font/abril-fatface/) - [Zilla Slab (serif)](https://fontfyi.com/font/zilla-slab/) - [Zen Kaku Gothic New (sans-serif)](https://fontfyi.com/font/zen-kaku-gothic-new/) - [IBM Plex Serif (serif)](https://fontfyi.com/font/ibm-plex-serif/) - [IBM Plex Sans Arabic (sans-serif)](https://fontfyi.com/font/ibm-plex-sans-arabic/) - [Fira Sans Condensed (sans-serif)](https://fontfyi.com/font/fira-sans-condensed/) - [Google Sans Code (monospace)](https://fontfyi.com/font/google-sans-code/) - [Bodoni Moda (serif)](https://fontfyi.com/font/bodoni-moda/) - [Exo (sans-serif)](https://fontfyi.com/font/exo/) - [Noto Serif KR (serif)](https://fontfyi.com/font/noto-serif-kr/) - [Chakra Petch (sans-serif)](https://fontfyi.com/font/chakra-petch/) - [ABeeZee (sans-serif)](https://fontfyi.com/font/abeezee/) - [Kalam (handwriting)](https://fontfyi.com/font/kalam/) - [Marcellus (serif)](https://fontfyi.com/font/marcellus/) - [Nanum Myeongjo (serif)](https://fontfyi.com/font/nanum-myeongjo/) - [Be Vietnam Pro (sans-serif)](https://fontfyi.com/font/be-vietnam-pro/) - [Archivo Narrow (sans-serif)](https://fontfyi.com/font/archivo-narrow/) - [Instrument Sans (sans-serif)](https://fontfyi.com/font/instrument-sans/) - [DM Mono (monospace)](https://fontfyi.com/font/dm-mono/) - [Great Vibes (handwriting)](https://fontfyi.com/font/great-vibes/) - [Spectral (serif)](https://fontfyi.com/font/spectral/) - [Unbounded (sans-serif)](https://fontfyi.com/font/unbounded/) - [Noto Serif TC (serif)](https://fontfyi.com/font/noto-serif-tc/) - [Noto Serif SC (serif)](https://fontfyi.com/font/noto-serif-sc/) - [Albert Sans (sans-serif)](https://fontfyi.com/font/albert-sans/) - [Titan One (display)](https://fontfyi.com/font/titan-one/) - [Signika (sans-serif)](https://fontfyi.com/font/signika/) - [Geist (sans-serif)](https://fontfyi.com/font/geist/) - [League Spartan (sans-serif)](https://fontfyi.com/font/league-spartan/) - [Noto Kufi Arabic (sans-serif)](https://fontfyi.com/font/noto-kufi-arabic/) - [Onest (sans-serif)](https://fontfyi.com/font/onest/) - [Permanent Marker (handwriting)](https://fontfyi.com/font/permanent-marker/) - [Geologica (sans-serif)](https://fontfyi.com/font/geologica/) - [Vollkorn (serif)](https://fontfyi.com/font/vollkorn/) - [Luckiest Guy (display)](https://fontfyi.com/font/luckiest-guy/) - [Space Mono (monospace)](https://fontfyi.com/font/space-mono/) - [Cormorant (serif)](https://fontfyi.com/font/cormorant/) - [Encode Sans (sans-serif)](https://fontfyi.com/font/encode-sans/) - [Epilogue (sans-serif)](https://fontfyi.com/font/epilogue/) - [Sarabun (sans-serif)](https://fontfyi.com/font/sarabun/) - [Saira Condensed (sans-serif)](https://fontfyi.com/font/saira-condensed/) - [Sanchez (serif)](https://fontfyi.com/font/sanchez/) - [Rowdies (display)](https://fontfyi.com/font/rowdies/) - [Alegreya (serif)](https://fontfyi.com/font/alegreya/) - [Sofia Sans (sans-serif)](https://fontfyi.com/font/sofia-sans/) - [Frank Ruhl Libre (serif)](https://fontfyi.com/font/frank-ruhl-libre/) - [Amiri (serif)](https://fontfyi.com/font/amiri/) - [Catamaran (sans-serif)](https://fontfyi.com/font/catamaran/) - [Atkinson Hyperlegible (sans-serif)](https://fontfyi.com/font/atkinson-hyperlegible/) - [Bree Serif (serif)](https://fontfyi.com/font/bree-serif/) - [Roboto Serif (serif)](https://fontfyi.com/font/roboto-serif/) - [Noto Sans Display (sans-serif)](https://fontfyi.com/font/noto-sans-display/) - [Acme (sans-serif)](https://fontfyi.com/font/acme/) - [Oleo Script (display)](https://fontfyi.com/font/oleo-script/) - [Zen Maru Gothic (sans-serif)](https://fontfyi.com/font/zen-maru-gothic/) - [Noticia Text (serif)](https://fontfyi.com/font/noticia-text/) - [Noto Sans Bengali (sans-serif)](https://fontfyi.com/font/noto-sans-bengali/) - [Alegreya Sans (sans-serif)](https://fontfyi.com/font/alegreya-sans/) - [Creepster (display)](https://fontfyi.com/font/creepster/) - [Noto Naskh Arabic (serif)](https://fontfyi.com/font/noto-naskh-arabic/) - [Montserrat Alternates (sans-serif)](https://fontfyi.com/font/montserrat-alternates/) - [Tinos (serif)](https://fontfyi.com/font/tinos/) - [Cardo (serif)](https://fontfyi.com/font/cardo/) - [Yanone Kaffeesatz (sans-serif)](https://fontfyi.com/font/yanone-kaffeesatz/) - [Unna (serif)](https://fontfyi.com/font/unna/) - [Red Hat Text (sans-serif)](https://fontfyi.com/font/red-hat-text/) ## Categories - [sans-serif (1 fonts)](https://fontfyi.com/category/sans-serif/) - [monospace (1 fonts)](https://fontfyi.com/category/monospace/) - [serif (1 fonts)](https://fontfyi.com/category/serif/) - [display (1 fonts)](https://fontfyi.com/category/display/) - [handwriting (1 fonts)](https://fontfyi.com/category/handwriting/) ## Font Tags - [Modern](https://fontfyi.com/tag/modern/) - [Classic](https://fontfyi.com/tag/classic/) - [Playful](https://fontfyi.com/tag/playful/) - [Elegant](https://fontfyi.com/tag/elegant/) - [Minimal](https://fontfyi.com/tag/minimal/) - [Bold](https://fontfyi.com/tag/bold/) - [Geometric](https://fontfyi.com/tag/geometric/) - [Humanist](https://fontfyi.com/tag/humanist/) - [Grotesque](https://fontfyi.com/tag/grotesque/) - [Slab Serif](https://fontfyi.com/tag/slab/) - [Condensed](https://fontfyi.com/tag/condensed/) - [Rounded](https://fontfyi.com/tag/rounded/) - [Decorative](https://fontfyi.com/tag/decorative/) - [Vintage](https://fontfyi.com/tag/vintage/) - [Tech](https://fontfyi.com/tag/techy/) - [Editorial](https://fontfyi.com/tag/editorial/) - [Friendly](https://fontfyi.com/tag/friendly/) - [Professional](https://fontfyi.com/tag/professional/) - [Artistic](https://fontfyi.com/tag/artistic/) - [Highly Readable](https://fontfyi.com/tag/readable/) - [Korean Support](https://fontfyi.com/tag/korean/) - [CJK Support](https://fontfyi.com/tag/cjk/) - [Variable Font](https://fontfyi.com/tag/variable/) - [Coding](https://fontfyi.com/tag/coding/) - [Handwritten](https://fontfyi.com/tag/handwritten/) - [Wide](https://fontfyi.com/tag/wide/) - [Narrow](https://fontfyi.com/tag/narrow/) - [High Contrast](https://fontfyi.com/tag/high-contrast/) - [Low Contrast](https://fontfyi.com/tag/low-contrast/) - [Multilingual](https://fontfyi.com/tag/multilingual/) ## Featured Font Pairings - [Inter + Merriweather](https://fontfyi.com/pairings/inter-plus-merriweather/) - [Playfair Display + Source Sans 3](https://fontfyi.com/pairings/playfair-display-plus-source-sans-3/) - [Poppins + Inter](https://fontfyi.com/pairings/poppins-plus-inter/) - [Montserrat + Roboto](https://fontfyi.com/pairings/montserrat-plus-roboto/) - [Oswald + Open Sans](https://fontfyi.com/pairings/oswald-plus-open-sans/) - [Space Grotesk + Inter](https://fontfyi.com/pairings/space-grotesk-plus-inter/) ## Typography Glossary - [Accessibility (Typography) — Typography practices ensuring content is usable by everyone — sufficient contrast, scalable text, cl](https://fontfyi.com/glossary/accessibility-typography/) - [Anti-aliasing — Smoothing the jagged edges of rendered text by blending edge pixels. CSS: -webkit-font-smoothing: an](https://fontfyi.com/glossary/anti-aliasing/) - [Aperture — The opening of a partially enclosed counter in letters like 'c', 'e', 's'. Wider apertures generally](https://fontfyi.com/glossary/aperture/) - [Ascender — The part of a lowercase letter that extends above the x-height, as in 'b', 'd', 'h', 'k', 'l'.](https://fontfyi.com/glossary/ascender/) - [Baseline — The invisible line on which most letters sit. Descenders extend below the baseline.](https://fontfyi.com/glossary/baseline/) - [Bauhaus Typography — The Bauhaus school (1919–1933) revolutionized typography with geometric forms, sans-serif preference](https://fontfyi.com/glossary/bauhaus-typography/) - [Bowl — The curved stroke creating an enclosed counter in letters like 'b', 'd', 'p', 'q'. The shape varies ](https://fontfyi.com/glossary/bowl/) - [Cap Height — The height of a capital letter measured from the baseline to the top of flat capitals like 'H' or 'I](https://fontfyi.com/glossary/cap-height/) - [CLS (Font-related) — Cumulative Layout Shift caused by font loading — text reflows when web font replaces fallback due to](https://fontfyi.com/glossary/cls-fonts/) - [Contrast Ratio — The luminance ratio between foreground text and background color. WCAG requires 4.5:1 for normal tex](https://fontfyi.com/glossary/contrast-ratio/) - [Contrast (Typography) — The difference between the thickest and thinnest parts of a letter's strokes. High-contrast fonts (l](https://fontfyi.com/glossary/contrast/) - [Counter — The enclosed or partially enclosed space within letters like 'o', 'e', 'p'. Open counters (as in 'c'](https://fontfyi.com/glossary/counter/) - [Crossbar — The horizontal stroke in letters like 'A', 'H', 'e', 'f'. Its position relative to the x-height affe](https://fontfyi.com/glossary/crossbar/) - [Descender — The part of a letter that extends below the baseline, as in 'g', 'j', 'p', 'q', 'y'.](https://fontfyi.com/glossary/descender/) - [Display Typeface — Typefaces designed for use at large sizes — headlines, posters, logos. Not optimized for body text r](https://fontfyi.com/glossary/display-typeface/) - [Dyslexia-Friendly Fonts — Fonts designed for improved readability for dyslexic readers — with unambiguous letterforms, generou](https://fontfyi.com/glossary/dyslexia-friendly/) - [Em — A typographic unit equal to the current font size. In CSS, 1em = the parent element's font size. The](https://fontfyi.com/glossary/em/) - [Fluid Typography — Typography that scales smoothly between minimum and maximum sizes using CSS clamp() — no breakpoint ](https://fontfyi.com/glossary/fluid-typography/) - [FOIT — Flash of Invisible Text — when text is hidden until the web font loads. Worse than FOUT for user exp](https://fontfyi.com/glossary/foit/) - [Font — A specific instance of a typeface at a particular weight, size, and style. For example, 'Inter Bold ](https://fontfyi.com/glossary/font/) - [font-display — A CSS descriptor that controls how a web font is displayed during loading. Values: auto, block, swap](https://fontfyi.com/glossary/font-display/) - [@font-face — A CSS at-rule that allows web designers to specify custom fonts for their web pages. The foundation ](https://fontfyi.com/glossary/font-face/) - [Font Family — A group of related fonts that share the same basic design but vary in weight, width, or style. In CS](https://fontfyi.com/glossary/font-family/) - [font-feature-settings — CSS property to control OpenType features — ligatures, small caps, tabular numbers, stylistic altern](https://fontfyi.com/glossary/font-feature-settings/) - [Font Loading API — JavaScript API (document.fonts) for programmatic font loading control — check if fonts are loaded, p](https://fontfyi.com/glossary/font-loading-api/) - [Font Pairing — The practice of selecting two or more complementary fonts to use together in a design. Usually combi](https://fontfyi.com/glossary/font-pairing/) - [Font Preloading — Using to prioritize font downloads, reducing FOUT/FOIT and improving ](https://fontfyi.com/glossary/font-preloading/) - [Font Stack — An ordered list of fonts in CSS font-family, providing fallbacks if the preferred font is unavailabl](https://fontfyi.com/glossary/font-stack/) - [font-variation-settings — CSS property to control variable font axes directly — weight, width, slant, and custom axes. Lower-l](https://fontfyi.com/glossary/font-variation-settings/) - [Font Weight — The thickness of character strokes, typically ranging from 100 (Thin) to 900 (Black). Regular is 400](https://fontfyi.com/glossary/font-weight/) - [FOUT — Flash of Unstyled Text — when a fallback font briefly appears before the web font loads. Mitigated b](https://fontfyi.com/glossary/fout/) - [Futura — The geometric sans-serif designed by Paul Renner in 1927, embodying Bauhaus modernism. Its influence](https://fontfyi.com/glossary/futura-history/) - [Garamond — The influential old-style serif typeface by Claude Garamond (~1530). One of the oldest typeface desi](https://fontfyi.com/glossary/garamond-history/) - [Geometric Sans — Sans-serif typefaces built on geometric shapes — circles, rectangles, triangles. Clean and modern bu](https://fontfyi.com/glossary/geometric-sans-class/) - [Glyph — A single visual representation of a character. One character can have multiple glyphs (e.g., regular](https://fontfyi.com/glossary/glyph/) - [Google Fonts — Google's free, open-source font library with 1,900+ families. The largest collection of freely-licen](https://fontfyi.com/glossary/google-fonts/) - [Gutenberg — Johannes Gutenberg invented movable type printing around 1440, enabling mass production of books and](https://fontfyi.com/glossary/gutenberg/) - [Helvetica — The iconic neo-grotesque typeface designed by Max Miedinger in 1957. Defined modern graphic design a](https://fontfyi.com/glossary/helvetica/) - [Hinting — Instructions embedded in a font that improve its rendering at small sizes on low-resolution screens ](https://fontfyi.com/glossary/hinting/) - [Humanist Sans — Sans-serif typefaces inspired by Renaissance handwriting with organic stroke variation. Warmer and m](https://fontfyi.com/glossary/humanist-sans-class/) - [Kerning — The adjustment of space between individual letter pairs to achieve visually consistent spacing.](https://fontfyi.com/glossary/kerning/) - [Leading — The vertical distance between lines of text, measured from baseline to baseline. Named after lead st](https://fontfyi.com/glossary/leading/) - [Legibility — How easily individual characters can be distinguished from each other — an intrinsic quality of the ](https://fontfyi.com/glossary/legibility/) - [Letter Spacing — The CSS property for adjusting spacing between all characters. Positive values spread letters apart;](https://fontfyi.com/glossary/letter-spacing/) - [Ligature — Two or more letters combined into a single glyph, like 'fi' or 'fl'. Common in serif fonts and codin](https://fontfyi.com/glossary/ligature/) - [Line Height — The CSS property controlling the distance between lines of text. Typically set to 1.5 or 150% for bo](https://fontfyi.com/glossary/line-height/) - [Measure — The length of a line of text, typically 45–75 characters for optimal readability. Too long or too sh](https://fontfyi.com/glossary/measure/) - [Modular Scale — A sequence of harmonious numbers based on a ratio (e.g., 1.25 minor third, 1.333 perfect fourth, 1.6](https://fontfyi.com/glossary/modular-scale/) - [Monospace — A typeface where every character occupies the same horizontal width. Essential for code editors and ](https://fontfyi.com/glossary/monospace/) - [Neo-grotesque — Refined sans-serif style from the 1950s with uniform strokes and neutral appearance. The dominant st](https://fontfyi.com/glossary/neo-grotesque-class/) - [OFL (SIL Open Font License) — The most common open-source font license. Allows free use, modification, and redistribution. All Goo](https://fontfyi.com/glossary/ofl/) - [OpenType — A font format developed by Microsoft and Adobe supporting advanced typographic features like ligatur](https://fontfyi.com/glossary/opentype/) - [Optical Size — Adjusting letterform details based on the intended display size. Small text needs more spacing and h](https://fontfyi.com/glossary/optical-size/) - [Proportional — A typeface where each character has a different width based on its shape — 'w' is wider than 'i'. Th](https://fontfyi.com/glossary/proportional/) - [Readability — How comfortably extended text can be read in longer passages — affected by font choice, size, line-h](https://fontfyi.com/glossary/readability/) - [Rem — Root em — a CSS unit relative to the root element's font size (usually 16px). More predictable than ](https://fontfyi.com/glossary/rem/) - [Responsive Typography — Typography that adapts to different screen sizes — using media queries, viewport units, or CSS clamp](https://fontfyi.com/glossary/responsive-typography/) - [Sans Serif — A typeface without serifs — 'sans' means 'without' in French. Clean, modern appearance popular in di](https://fontfyi.com/glossary/sans-serif/) - [Script Typeface — Typefaces based on connected, flowing handwriting. Range from formal calligraphic styles to casual b](https://fontfyi.com/glossary/script-typeface/) - [Serif — A small decorative stroke added to the end of a letter's main strokes. Serif fonts (like Times New R](https://fontfyi.com/glossary/serif/) - [Slab Serif — Serif typefaces with thick, block-like rectangular serifs. Strong visual presence for headlines, UI ](https://fontfyi.com/glossary/slab-serif-class/) - [Stem — The main vertical stroke of a letter, such as the upright in 'l', 'b', 'd'. The heaviest stroke in m](https://fontfyi.com/glossary/stem/) - [Stroke — Any line that forms part of a letter — vertical, horizontal, diagonal, or curved. Stroke contrast de](https://fontfyi.com/glossary/stroke/) - [Subsetting — Removing unused characters from a font file to reduce download size. For example, loading only Latin](https://fontfyi.com/glossary/subsetting/) - [Swash — An extended, decorative stroke on a letter, common in italic and display fonts. Adds elegance and fl](https://fontfyi.com/glossary/swash/) - [Swiss Style — The International Typographic Style (1950s–) emphasized grids, asymmetric layouts, and sans-serif ty](https://fontfyi.com/glossary/swiss-style/) - [System Font — A font pre-installed on the operating system. Using system fonts (system-ui stack) eliminates downlo](https://fontfyi.com/glossary/system-font/) - [Terminal — The end of a stroke that doesn't have a serif — can be ball, beak, teardrop, or flat shaped. Termina](https://fontfyi.com/glossary/terminal/) - [text-rendering — CSS property controlling text rendering quality: auto, optimizeSpeed, optimizeLegibility, geometricP](https://fontfyi.com/glossary/text-rendering/) - [Tracking — The uniform adjustment of spacing across an entire range of characters, unlike kerning which targets](https://fontfyi.com/glossary/tracking/) - [Typeface — The overall design of a set of characters — the artistic creation. Often confused with 'font', which](https://fontfyi.com/glossary/typeface/) - [Type Scale — A harmonious progression of font sizes based on a ratio (e.g., 1.25, 1.333, 1.5). Creates visual hie](https://fontfyi.com/glossary/type-scale/) - [Typographic Color — The overall visual density or texture of a block of text on a page — affected by font weight, size, ](https://fontfyi.com/glossary/typographic-color/) - [Typographic Hierarchy — The visual organization of text using size, weight, color, and spacing to guide readers through cont](https://fontfyi.com/glossary/typographic-hierarchy/) - [unicode-range — CSS descriptor in @font-face that specifies which Unicode characters to download from a font file, e](https://fontfyi.com/glossary/unicode-range/) - [Variable Font — A single font file containing an entire range of weights, widths, or other variations. Reduces HTTP ](https://fontfyi.com/glossary/variable-font/) - [Vertical Rhythm — Consistent spacing pattern that aligns text baselines and element spacing to a baseline grid. Create](https://fontfyi.com/glossary/vertical-rhythm/) - [WCAG Typography — Web Content Accessibility Guidelines as applied to text — minimum contrast ratios (4.5:1 AA, 7:1 AAA](https://fontfyi.com/glossary/wcag-typography/) - [Web Font — A font specifically designed or licensed for use on websites, loaded via CSS @font-face or services ](https://fontfyi.com/glossary/web-font/) - [Whitespace — The intentional empty space in a design that gives text and elements room to breathe. Critical for r](https://fontfyi.com/glossary/whitespace/) - [WOFF2 — Web Open Font Format 2.0 — Brotli-compressed, the most efficient font format for the web. ~30% small](https://fontfyi.com/glossary/woff2/) - [Word Spacing — The CSS property controlling the distance between words — default is defined by the font's space cha](https://fontfyi.com/glossary/word-spacing/) - [x-height — The height of lowercase letters (like 'x') measured from the baseline. A key factor in perceived fon](https://fontfyi.com/glossary/x-height/) ## Full Index - [XML Sitemap](https://fontfyi.com/sitemap.xml)