We're dsplce.co, check out our work on github.com/dsplce-co 🖤

dioxus-google-fonts

💅 Declarative Google Fonts embedding for Dioxus — done right.

This crate provides two declarative macros for working with Google Fonts in a Dioxus app:

• google_fonts_url! — generates the Google Fonts <link> URL
• google_fonts! — renders an actual document::Link node for easy use in rsx!

---

🖤 Features

✅ Links are generated at compile time
✅ Declarative macro syntax
✅ Supports multiple fonts, weights and italics
✅ Auto-generates ital,wght@... combinations
✅ Automatically adds display=swap
✅ Works out of the box with Dioxus Web + SSR

---

📦 Installation

Add to your Cargo.toml:

# In your main Dioxus app
dioxus-google-fonts = "0.1"

# This is a procedural macro crate, it will bring in `proc-macro2`, `syn`, etc.

---

🧪 Example

use dioxus_google_fonts::google_fonts_url;

fn main() -> Element {
    let url = google_fonts_url!([
        ("Roboto", wght = [400, 700], ital = [(1, 700)]),
        ("Manrope", wght = ["200..800"])
    ]);
    
    assert_eq!(
        url,
        "https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&family=Manrope:wght@200..800&display=swap"
    );
}

use dioxus::prelude::*;
use dioxus_google_fonts::google_fonts;

fn App() -> Element {
    rsx! {
        { google_fonts!([
            ("Roboto", wght = [400, 700], ital = [(1, 700)]),
            ("Mukta", wght = ["200..900"])
        ]) }

        h1 { "Hello, typographically!" }
    }
}

fn main() {
    dioxus::web::launch(App);
}

---

🧠 Supported Syntax

Each font entry uses a tuple-like DSL:

("Font Name", wght = [weights...], ital = [(italic_flag, weight)...])

• wght: weights, as numbers (400, 700) or ranges ("200..800")
• ital: tuples like (1, 700) → italic, weight
• ital,wght@... style gets auto-generated
• display=swap is always added to the URL (sensible default)

---

🧱 Example Output

https://fonts.googleapis.com/css2?
  family=Roboto:ital,wght@1,700&
  family=Manrope:wght@200..800&
  display=swap

---

📁 Repo & Contributions

📦 Crate: crates.io/crates/dioxus-google-fonts
🛠️ Repo: github.com/dsplce-co/dioxus-google-fonts

PRs welcome! Let’s make Dioxus + typography best friends. 🖤

---

📄 License

MIT or Apache-2.0, at your option.