Index: nextjs-dashboard/app/dashboard/(overview)/page.tsx
===================================================================
--- nextjs-dashboard/app/dashboard/(overview)/page.tsx	(revision fab6a6fa7856aeb912b092cc821bca7d1c4d2ccc)
+++ nextjs-dashboard/app/dashboard/(overview)/page.tsx	(revision cdb3fc1cc1a750cd535193619af9908afd4676cd)
@@ -2,5 +2,5 @@
 import RevenueChart from '@/app/ui/dashboard/revenue-chart';
 import LatestInvoices from '@/app/ui/dashboard/latest-invoices';
-import { firaCode } from '@/app/ui/fonts';
+import { poppins } from '@/app/ui/fonts';
 import { Suspense } from 'react';
 import {
@@ -18,5 +18,5 @@
     return (
         <main>
-            <h1 className={`${firaCode.className} mb-4 text-xl md:text-2xl`}>
+            <h1 className={`${poppins.className} mb-4 text-xl md:text-2xl`}>
                 Dashboard
             </h1>
Index: nextjs-dashboard/app/dashboard/invoices/page.tsx
===================================================================
--- nextjs-dashboard/app/dashboard/invoices/page.tsx	(revision fab6a6fa7856aeb912b092cc821bca7d1c4d2ccc)
+++ nextjs-dashboard/app/dashboard/invoices/page.tsx	(revision cdb3fc1cc1a750cd535193619af9908afd4676cd)
@@ -3,5 +3,5 @@
 import Table from '@/app/ui/invoices/table';
 import { CreateInvoice } from '@/app/ui/invoices/buttons';
-import { firaCode } from '@/app/ui/fonts';
+import { poppins } from '@/app/ui/fonts';
 import { InvoicesTableSkeleton } from '@/app/ui/skeletons';
 import { Suspense } from 'react';
@@ -27,5 +27,5 @@
         <div className="w-full">
             <div className="flex w-full items-center justify-between">
-                <h1 className={`${firaCode.className} text-2xl`}>Invoices</h1>
+                <h1 className={`${poppins.className} text-2xl`}>Invoices</h1>
             </div>
             <div className="mt-4 flex items-center justify-between gap-2 md:mt-8">
Index: nextjs-dashboard/app/layout.tsx
===================================================================
--- nextjs-dashboard/app/layout.tsx	(revision fab6a6fa7856aeb912b092cc821bca7d1c4d2ccc)
+++ nextjs-dashboard/app/layout.tsx	(revision cdb3fc1cc1a750cd535193619af9908afd4676cd)
@@ -1,4 +1,4 @@
 import '@/app/ui/global.css';
-import { firaCode } from '@/app/ui/fonts';
+import { poppins } from '@/app/ui/fonts';
 import { Metadata } from 'next';
 
@@ -18,5 +18,5 @@
   return (
     <html lang="en">
-      <body className={`${firaCode.className} antialiased`}>{children}</body>
+      <body className={`${poppins.className} antialiased bg-black md:bg-black`}>
     </html>
   );
Index: nextjs-dashboard/app/login/page.tsx
===================================================================
--- nextjs-dashboard/app/login/page.tsx	(revision fab6a6fa7856aeb912b092cc821bca7d1c4d2ccc)
+++ nextjs-dashboard/app/login/page.tsx	(revision cdb3fc1cc1a750cd535193619af9908afd4676cd)
@@ -2,4 +2,5 @@
 import { Suspense } from 'react';
 import { Metadata } from 'next';
+import { poppins } from '@/app/ui/fonts';
 
 export const metadata: Metadata = {
Index: nextjs-dashboard/app/page.tsx
===================================================================
--- nextjs-dashboard/app/page.tsx	(revision fab6a6fa7856aeb912b092cc821bca7d1c4d2ccc)
+++ nextjs-dashboard/app/page.tsx	(revision cdb3fc1cc1a750cd535193619af9908afd4676cd)
@@ -1,5 +1,5 @@
 import { ArrowRightIcon } from '@heroicons/react/24/outline';
 import Link from 'next/link';
-import { firaCode } from '@/app/ui/fonts';
+import { poppins } from '@/app/ui/fonts';
 import Image from 'next/image';
 
@@ -10,5 +10,5 @@
         <div className="flex flex-col justify-center gap-6 rounded-lg bg-gray-50 px-6 py-10 md:w-2/5 md:px-20">
           <p
-            className={`${firaCode.className} text-xl text-gray-800 md:text-2xl md:leading-normal antialiased`}
+            className={`${poppins.className} text-xl text-gray-800 md:text-2xl md:leading-normal antialiased`}
           >
             <strong>Welcome to FEiN.</strong>
Index: nextjs-dashboard/app/ui/customers/table.tsx
===================================================================
--- nextjs-dashboard/app/ui/customers/table.tsx	(revision fab6a6fa7856aeb912b092cc821bca7d1c4d2ccc)
+++ nextjs-dashboard/app/ui/customers/table.tsx	(revision cdb3fc1cc1a750cd535193619af9908afd4676cd)
@@ -1,4 +1,4 @@
 import Image from 'next/image';
-import { firaCode } from '@/app/ui/fonts';
+import { poppins } from '@/app/ui/fonts';
 import Search from '@/app/ui/search';
 import {
@@ -14,5 +14,5 @@
   return (
     <div className="w-full">
-      <h1 className={`${firaCode.className} mb-8 text-xl md:text-2xl`}>
+      <h1 className={`${poppins.className} mb-8 text-xl md:text-2xl`}>
         Customers
       </h1>
Index: nextjs-dashboard/app/ui/dashboard/cards.tsx
===================================================================
--- nextjs-dashboard/app/ui/dashboard/cards.tsx	(revision fab6a6fa7856aeb912b092cc821bca7d1c4d2ccc)
+++ nextjs-dashboard/app/ui/dashboard/cards.tsx	(revision cdb3fc1cc1a750cd535193619af9908afd4676cd)
@@ -5,5 +5,5 @@
   InboxIcon,
 } from '@heroicons/react/24/outline';
-import { firaCode } from '@/app/ui/fonts';
+import { poppins } from '@/app/ui/fonts';
 import { fetchCardData } from '@/app/lib/data';
 
@@ -55,5 +55,5 @@
       </div>
       <p
-        className={`${firaCode.className}
+        className={`${poppins.className}
           truncate rounded-xl bg-white px-4 py-8 text-center text-2xl`}
       >
Index: nextjs-dashboard/app/ui/dashboard/latest-invoices.tsx
===================================================================
--- nextjs-dashboard/app/ui/dashboard/latest-invoices.tsx	(revision fab6a6fa7856aeb912b092cc821bca7d1c4d2ccc)
+++ nextjs-dashboard/app/ui/dashboard/latest-invoices.tsx	(revision cdb3fc1cc1a750cd535193619af9908afd4676cd)
@@ -2,5 +2,5 @@
 import clsx from 'clsx';
 import Image from 'next/image';
-import { firaCode } from '@/app/ui/fonts';
+import { poppins } from '@/app/ui/fonts';
 import { LatestInvoice } from '@/app/lib/definitions';
 import { fetchLatestInvoices } from '@/app/lib/data';
@@ -10,5 +10,5 @@
   return (
     <div className="flex w-full flex-col md:col-span-4">
-      <h2 className={`${firaCode.className} mb-4 text-xl md:text-2xl`}>
+      <h2 className={`${poppins.className} mb-4 text-xl md:text-2xl`}>
         Latest Invoices
       </h2>
@@ -45,5 +45,5 @@
                 </div>
                 <p
-                  className={`${firaCode.className} truncate text-sm font-medium md:text-base`}
+                  className={`${poppins.className} truncate text-sm font-medium md:text-base`}
                 >
                   {invoice.amount}
Index: nextjs-dashboard/app/ui/dashboard/revenue-chart.tsx
===================================================================
--- nextjs-dashboard/app/ui/dashboard/revenue-chart.tsx	(revision fab6a6fa7856aeb912b092cc821bca7d1c4d2ccc)
+++ nextjs-dashboard/app/ui/dashboard/revenue-chart.tsx	(revision cdb3fc1cc1a750cd535193619af9908afd4676cd)
@@ -1,5 +1,5 @@
 import { generateYAxis } from '@/app/lib/utils';
 import { CalendarIcon } from '@heroicons/react/24/outline';
-import { firaCode } from '@/app/ui/fonts';
+import { poppins } from '@/app/ui/fonts';
 import { Revenue } from '@/app/lib/definitions';
 import { fetchRevenue } from '@/app/lib/data';
@@ -23,5 +23,5 @@
   return (
     <div className="w-full md:col-span-4">
-      <h2 className={`${firaCode.className} mb-4 text-xl md:text-2xl`}>
+      <h2 className={`${poppins.className} mb-4 text-xl md:text-2xl`}>
         Recent Revenue
       </h2>
Index: nextjs-dashboard/app/ui/fonts.ts
===================================================================
--- nextjs-dashboard/app/ui/fonts.ts	(revision fab6a6fa7856aeb912b092cc821bca7d1c4d2ccc)
+++ nextjs-dashboard/app/ui/fonts.ts	(revision cdb3fc1cc1a750cd535193619af9908afd4676cd)
@@ -1,3 +1,3 @@
-import { Fira_Code } from 'next/font/google';
+import { Poppins } from 'next/font/google';
 
-export const firaCode = Fira_Code({ subsets: ['latin'] });
+export const poppins = Poppins({ weight: ['500'], subsets: ['latin'] });
Index: nextjs-dashboard/app/ui/invoices/breadcrumbs.tsx
===================================================================
--- nextjs-dashboard/app/ui/invoices/breadcrumbs.tsx	(revision fab6a6fa7856aeb912b092cc821bca7d1c4d2ccc)
+++ nextjs-dashboard/app/ui/invoices/breadcrumbs.tsx	(revision cdb3fc1cc1a750cd535193619af9908afd4676cd)
@@ -1,5 +1,5 @@
 import { clsx } from 'clsx';
 import Link from 'next/link';
-import { firaCode } from '@/app/ui/fonts';
+import { poppins } from '@/app/ui/fonts';
 
 interface Breadcrumb {
@@ -16,5 +16,5 @@
   return (
     <nav aria-label="Breadcrumb" className="mb-6 block">
-      <ol className={clsx(firaCode.className, 'flex text-xl md:text-2xl')}>
+      <ol className={clsx(poppins.className, 'flex text-xl md:text-2xl')}>
         {breadcrumbs.map((breadcrumb, index) => (
           <li
Index: nextjs-dashboard/app/ui/login-form.tsx
===================================================================
--- nextjs-dashboard/app/ui/login-form.tsx	(revision fab6a6fa7856aeb912b092cc821bca7d1c4d2ccc)
+++ nextjs-dashboard/app/ui/login-form.tsx	(revision cdb3fc1cc1a750cd535193619af9908afd4676cd)
@@ -1,5 +1,5 @@
 'use client';
 
-import { firaCode } from '@/app/ui/fonts';
+import { poppins } from '@/app/ui/fonts';
 import {
   AtSymbolIcon,
