18. GoogleFont

Cursor

layout.tsx

import { Inter } from "next/font/google";

const sans = Inter({
  variable: "--font-inter",
  subsets: ["latin"],
})



  return(
    <html
      lang="en"
      className={`${sans.variable}`}
  )

variable: “–font-inter”を使うことで、「–font-inter」という変数が他のファイルでも使えるようになる

globals.css

body {
  font-family: var(--font-inter);
}
BACK