Fontora - Curated Catalog of Open-Source Typefaces

✨ Features

Live Specimen Previews: Adjustable specimen sizing with instant “Aa” glyph samples across 1,976 font families.
Variable Font Support: Dedicated playgrounds, badges, and axis controls for 565 variable families.
Shareable Filters: Writing system, category, style, and style-count filters encoded in the URL for easy sharing.
Font Detail Pages: Per-family routes with specimen tabs, glyph grids, style lists, and language coverage.
Pairings & Embed Snippets: Suggested font pairings plus ready-to-paste embed code for every family.
Curated Collections: Six themed groups — Grotesque Essentials, Editorial Serifs, Display & Impact, Terminal & Code, Friendly Geometrics, and Classic Revivals.
Selection Bag: Collect and compare favorite families while browsing.

🧱 Tech Stack

Astro: Static site generation and content-driven routing.
React: Component-driven interactive UI.
TypeScript: Static typing and developer tooling.
Tailwind: Utility-first styling system.
shadcn/ui: UI primitives, composition patterns, and design tokens.

🔌 Font Resources

Fontsource CDN: Self-hosted font delivery for every cataloged family.
Google Fonts: Catalog reference and upstream metadata.
Open Font License: Licensing covering the open-source typefaces.

🚀 Getting Started

Clone the repo, install deps, and boot the dev server:

git clone https://github.com/KurutoDenzeru/fontora.git
cd fontora
bun install
bun run dev

Open http://localhost:4321 to view the site.

📦 Build for Production

bun run build
bun run preview

🗂️ Configuration

The site is implemented under src/. Key areas to customize and extend are:

src/
  components/
    catalog/                      # Browse grid, filter sidebar, hero, and specimen cards
    font-detail/                  # Family detail tabs: specimen, glyphs, pairings, embed
    selection/                    # Selection bag for collecting and comparing families
    dock-nav.tsx                  # Dock navigation shell
    site-footer.tsx               # Global footer
    theme-selector.tsx            # Theme switching controls
  data/
    fonts.json                    # Synced catalog of 1,900+ families
    variable-axis-map.json        # Variable font axis metadata
    curation.ts                   # Curated collection definitions
  lib/
    font-loader.ts                # Fontsource CDN loading
    fonts.ts                      # Catalog access, filtering, and sorting helpers
  layouts/
    main.astro                    # Base layout shell
  pages/
    index.astro                   # Catalog home
    fonts/[id].astro              # Family detail route
  styles/
    global.css                    # Global styles and theme tokens
scripts/
  sync-fonts.ts                   # Refreshes fonts.json from upstream sources (`bun run sync:fonts`)

🤝🏻 Contributing

Contributions are always welcome, whether you’re fixing bugs, improving docs, or shipping new features that make the project better for everyone.

Check out Contributing.md to learn how to get started and follow the recommended workflow.

⚖️ License

Licensing details are available in the repository.