diff --git a/app/globals.css b/app/globals.css index 42e51a6..c197dc4 100644 --- a/app/globals.css +++ b/app/globals.css @@ -38,6 +38,7 @@ --font-sans: "Fraunces", ui-sans-serif, system-ui, sans-serif; --font-serif: "IBM Plex Mono", ui-monospace, monospace; --font-mono: "JetBrains Mono", ui-monospace, monospace; + --font-display: "Space Grotesk"; /* Typography scale */ --text-xs: 0.75rem; --text-xs--line-height: 1.2; diff --git a/app/layout.tsx b/app/layout.tsx index eab68b4..efd7672 100644 --- a/app/layout.tsx +++ b/app/layout.tsx @@ -1,5 +1,5 @@ import type { Metadata } from 'next' -import { Fraunces, IBM_Plex_Mono, JetBrains_Mono } from 'next/font/google' +import { Fraunces, IBM_Plex_Mono, JetBrains_Mono, Space_Grotesk } from 'next/font/google' import { ThemeProvider } from '@wrksz/themes/next' import './globals.css' import 'katex/dist/katex.min.css' @@ -17,6 +17,12 @@ const fraunces = Fraunces({ variable: '--font-fraunces', }) +const spaceGrotesk = Space_Grotesk({ + subsets: ['latin'], + display: 'swap', + variable: '--font-space-grotesk', +}) + const jetbrainsMono = JetBrains_Mono({ subsets: ['latin'], display: 'swap', @@ -49,7 +55,7 @@ export const metadata: Metadata = { export default function RootLayout({ children }: { children: React.ReactNode }) { return ( - +