Tailwind Setup
Register 'Give You Glory' as a utility class (font-give-you-glory) — pick the config style that matches your project.
Load from catalog
Classic Config
tailwind.config.js
JS-based config — works on Tailwind v3, and on v4 in JS-config compatibility mode.
// tailwind.config.js — classic JS config
/** @type {import('tailwindcss').Config} */
module.exports = {
theme: {
extend: {
fontFamily: {
give-you-glory: ['Give You Glory', 'sans-serif'],
},
},
},
};CSS-First Config
Tailwind v4+
Native @theme syntax — no config file, everything lives in CSS.
/* globals.css — Tailwind v4+ CSS-first config */
@import "tailwindcss";
@font-face {
font-family: 'Give You Glory';
src: url('https://assets.typamine.com/fonts/files/a21b0aad-ba02-4a43-b4a6-3b8750d3acc3.woff2') format('woff2');
font-display: swap;
}
@theme {
--font-give-you-glory: 'Give You Glory', sans-serif;
}
/* Usage: <p className="font-give-you-glory">...</p> */