shadcn-ui/apps/v4/lib/font-definitions.ts

export type FontDefinition = {
  name: string
  title: string
  type: "sans" | "mono" | "serif"
  family: string
  registryVariable: "--font-sans" | "--font-mono" | "--font-serif"
  previewVariable: string
  provider: "google"
  import: string
  dependency: string
  subsets: readonly string[]
  weight?: readonly string[]
}

export const FONT_DEFINITIONS = [
  {
    name: "geist",
    title: "Geist",
    type: "sans",
    family: "'Geist Variable', sans-serif",
    registryVariable: "--font-sans",
    previewVariable: "--font-geist-sans",
    provider: "google",
    import: "Geist",
    dependency: "@fontsource-variable/geist",
    subsets: ["latin"],
  },
  {
    name: "inter",
    title: "Inter",
    type: "sans",
    family: "'Inter Variable', sans-serif",
    registryVariable: "--font-sans",
    previewVariable: "--font-inter",
    provider: "google",
    import: "Inter",
    dependency: "@fontsource-variable/inter",
    subsets: ["latin"],
  },
  {
    name: "noto-sans",
    title: "Noto Sans",
    type: "sans",
    family: "'Noto Sans Variable', sans-serif",
    registryVariable: "--font-sans",
    previewVariable: "--font-noto-sans",
    provider: "google",
    import: "Noto_Sans",
    dependency: "@fontsource-variable/noto-sans",
    subsets: ["latin"],
  },
  {
    name: "nunito-sans",
    title: "Nunito Sans",
    type: "sans",
    family: "'Nunito Sans Variable', sans-serif",
    registryVariable: "--font-sans",
    previewVariable: "--font-nunito-sans",
    provider: "google",
    import: "Nunito_Sans",
    dependency: "@fontsource-variable/nunito-sans",
    subsets: ["latin"],
  },
  {
    name: "figtree",
    title: "Figtree",
    type: "sans",
    family: "'Figtree Variable', sans-serif",
    registryVariable: "--font-sans",
    previewVariable: "--font-figtree",
    provider: "google",
    import: "Figtree",
    dependency: "@fontsource-variable/figtree",
    subsets: ["latin"],
  },
  {
    name: "roboto",
    title: "Roboto",
    type: "sans",
    family: "'Roboto Variable', sans-serif",
    registryVariable: "--font-sans",
    previewVariable: "--font-roboto",
    provider: "google",
    import: "Roboto",
    dependency: "@fontsource-variable/roboto",
    subsets: ["latin"],
  },
  {
    name: "raleway",
    title: "Raleway",
    type: "sans",
    family: "'Raleway Variable', sans-serif",
    registryVariable: "--font-sans",
    previewVariable: "--font-raleway",
    provider: "google",
    import: "Raleway",
    dependency: "@fontsource-variable/raleway",
    subsets: ["latin"],
  },
  {
    name: "dm-sans",
    title: "DM Sans",
    type: "sans",
    family: "'DM Sans Variable', sans-serif",
    registryVariable: "--font-sans",
    previewVariable: "--font-dm-sans",
    provider: "google",
    import: "DM_Sans",
    dependency: "@fontsource-variable/dm-sans",
    subsets: ["latin"],
  },
  {
    name: "public-sans",
    title: "Public Sans",
    type: "sans",
    family: "'Public Sans Variable', sans-serif",
    registryVariable: "--font-sans",
    previewVariable: "--font-public-sans",
    provider: "google",
    import: "Public_Sans",
    dependency: "@fontsource-variable/public-sans",
    subsets: ["latin"],
  },
  {
    name: "outfit",
    title: "Outfit",
    type: "sans",
    family: "'Outfit Variable', sans-serif",
    registryVariable: "--font-sans",
    previewVariable: "--font-outfit",
    provider: "google",
    import: "Outfit",
    dependency: "@fontsource-variable/outfit",
    subsets: ["latin"],
  },
  {
    name: "oxanium",
    title: "Oxanium",
    type: "sans",
    family: "'Oxanium Variable', sans-serif",
    registryVariable: "--font-sans",
    previewVariable: "--font-oxanium",
    provider: "google",
    import: "Oxanium",
    dependency: "@fontsource-variable/oxanium",
    subsets: ["latin"],
  },
  {
    name: "manrope",
    title: "Manrope",
    type: "sans",
    family: "'Manrope Variable', sans-serif",
    registryVariable: "--font-sans",
    previewVariable: "--font-manrope",
    provider: "google",
    import: "Manrope",
    dependency: "@fontsource-variable/manrope",
    subsets: ["latin"],
  },
  {
    name: "space-grotesk",
    title: "Space Grotesk",
    type: "sans",
    family: "'Space Grotesk Variable', sans-serif",
    registryVariable: "--font-sans",
    previewVariable: "--font-space-grotesk",
    provider: "google",
    import: "Space_Grotesk",
    dependency: "@fontsource-variable/space-grotesk",
    subsets: ["latin"],
  },
  {
    name: "montserrat",
    title: "Montserrat",
    type: "sans",
    family: "'Montserrat Variable', sans-serif",
    registryVariable: "--font-sans",
    previewVariable: "--font-montserrat",
    provider: "google",
    import: "Montserrat",
    dependency: "@fontsource-variable/montserrat",
    subsets: ["latin"],
  },
  {
    name: "ibm-plex-sans",
    title: "IBM Plex Sans",
    type: "sans",
    family: "'IBM Plex Sans Variable', sans-serif",
    registryVariable: "--font-sans",
    previewVariable: "--font-ibm-plex-sans",
    provider: "google",
    import: "IBM_Plex_Sans",
    dependency: "@fontsource-variable/ibm-plex-sans",
    subsets: ["latin"],
  },
  {
    name: "source-sans-3",
    title: "Source Sans 3",
    type: "sans",
    family: "'Source Sans 3 Variable', sans-serif",
    registryVariable: "--font-sans",
    previewVariable: "--font-source-sans-3",
    provider: "google",
    import: "Source_Sans_3",
    dependency: "@fontsource-variable/source-sans-3",
    subsets: ["latin"],
  },
  {
    name: "instrument-sans",
    title: "Instrument Sans",
    type: "sans",
    family: "'Instrument Sans Variable', sans-serif",
    registryVariable: "--font-sans",
    previewVariable: "--font-instrument-sans",
    provider: "google",
    import: "Instrument_Sans",
    dependency: "@fontsource-variable/instrument-sans",
    subsets: ["latin"],
  },
  {
    name: "jetbrains-mono",
    title: "JetBrains Mono",
    type: "mono",
    family: "'JetBrains Mono Variable', monospace",
    registryVariable: "--font-mono",
    previewVariable: "--font-jetbrains-mono",
    provider: "google",
    import: "JetBrains_Mono",
    dependency: "@fontsource-variable/jetbrains-mono",
    subsets: ["latin"],
  },
  {
    name: "geist-mono",
    title: "Geist Mono",
    type: "mono",
    family: "'Geist Mono Variable', monospace",
    registryVariable: "--font-mono",
    previewVariable: "--font-geist-mono",
    provider: "google",
    import: "Geist_Mono",
    dependency: "@fontsource-variable/geist-mono",
    subsets: ["latin"],
  },
  {
    name: "noto-serif",
    title: "Noto Serif",
    type: "serif",
    family: "'Noto Serif Variable', serif",
    registryVariable: "--font-serif",
    previewVariable: "--font-noto-serif",
    provider: "google",
    import: "Noto_Serif",
    dependency: "@fontsource-variable/noto-serif",
    subsets: ["latin"],
  },
  {
    name: "roboto-slab",
    title: "Roboto Slab",
    type: "serif",
    family: "'Roboto Slab Variable', serif",
    registryVariable: "--font-serif",
    previewVariable: "--font-roboto-slab",
    provider: "google",
    import: "Roboto_Slab",
    dependency: "@fontsource-variable/roboto-slab",
    subsets: ["latin"],
  },
  {
    name: "merriweather",
    title: "Merriweather",
    type: "serif",
    family: "'Merriweather Variable', serif",
    registryVariable: "--font-serif",
    previewVariable: "--font-merriweather",
    provider: "google",
    import: "Merriweather",
    dependency: "@fontsource-variable/merriweather",
    subsets: ["latin"],
  },
  {
    name: "lora",
    title: "Lora",
    type: "serif",
    family: "'Lora Variable', serif",
    registryVariable: "--font-serif",
    previewVariable: "--font-lora",
    provider: "google",
    import: "Lora",
    dependency: "@fontsource-variable/lora",
    subsets: ["latin"],
  },
  {
    name: "playfair-display",
    title: "Playfair Display",
    type: "serif",
    family: "'Playfair Display Variable', serif",
    registryVariable: "--font-serif",
    previewVariable: "--font-playfair-display",
    provider: "google",
    import: "Playfair_Display",
    dependency: "@fontsource-variable/playfair-display",
    subsets: ["latin"],
  },
] as const satisfies readonly FontDefinition[]

export type FontName = (typeof FONT_DEFINITIONS)[number]["name"]