#dioxus #font #url #dioxus-google-fonts

macro dioxus-google-fonts

A declarative Google Fonts embedding for Dioxus

2 releases

Uses new Rust 2024

new 0.1.1 Apr 12, 2025
0.1.0 Apr 12, 2025

#356 in Procedural macros

MIT/Apache

9KB
103 lines

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.

Dependencies

~205–640KB
~15K SLoC