Giter Club home page Giter Club logo

google-fonts-loader-v2's Introduction

Google Fonts Loader v2

npm version npm downloads npm downloads npm downloads

A Google Fonts library specifically designed for the v2 API and variable fonts, which helps to load them in the browser.

🎯 Features

  • Google Fonts v2 API
  • Variable fonts
  • Promise that await for a font to be fully loaded
  • List loaded fonts
  • Unloading fonts
  • Type safe/Typescript support

⚙️ Install

npm install google-fonts-loader-v2
# or
yarn add google-fonts-loader-v2
# or
pnpm add google-fonts-loader-v2
# or
bun add google-fonts-loader-v2

📖 Usage

import {loadAwait, list, unload} from "google-fonts-loader-v2";

console.log("Loading Open Sans…");
await loadAwait({
    family: "Open Sans",
    axisTupleList: [
        [
            {tag: "ital", value: 0},
            {tag: "wght", value: 500},
        ],
        [
            {tag: "ital", value: 1},
            {tag: "wght", value: 500},
        ],
    ],
}, {
    display: "swap",
});
console.log("Open Sans loaded!");

console.log(`${list().length} fonts loaded!`);

console.log("Unloading Open Sans…");
unload({
    family: "Open Sans",
});
console.log("Open Sans unloaded!");

📚 Documentation

load()

load(font: Font, options?: Options): void

Just load the given font in the curent page.

loadAwait()

loadAwait(font: Font, options?: Options): Promise<void>

Load the given font and return a promise that resolve when the font is fully loaded.

list()

list(): Font[]

List the currently loaded fonts.

unload()

unload(font: Font): void

Unload the given font family.

unloadAll()

unloadAll(): void

Unload all the previously loaded fonts.

🐜 Known bugs

google-fonts-loader-v2's People

Contributors

branchard avatar

Stargazers

 avatar

Watchers

 avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.