diff --git a/apps/changelog/src/app/(changelog)/globals.css b/apps/changelog/src/app/(changelog)/globals.css
deleted file mode 100644
index e69de29bb2d1d..0000000000000
diff --git a/apps/changelog/src/app/(changelog)/layout.module.css b/apps/changelog/src/app/(changelog)/layout.module.css
deleted file mode 100644
index bebc60cf92811..0000000000000
--- a/apps/changelog/src/app/(changelog)/layout.module.css
+++ /dev/null
@@ -1,3 +0,0 @@
-.changelogContent {
-  font-family: var(--font-rubik);
-}
diff --git a/apps/changelog/src/app/(changelog)/layout.tsx b/apps/changelog/src/app/(changelog)/layout.tsx
index 8bb7becdf0bd5..22c3e26f2468b 100644
--- a/apps/changelog/src/app/(changelog)/layout.tsx
+++ b/apps/changelog/src/app/(changelog)/layout.tsx
@@ -17,7 +17,7 @@ export default function ChangelogLayout({children}: {children: ReactNode}) {
   return (
     <Fragment>
       <NextTopLoader color="#8d5494" />
-      <div className={styles.changelogContent}>
+      <div className="font-sans">
         <Navbar />
         <div className="bg-gray-100">{children}</div>
         <div className="w-full mx-auto h-16 relative bg-darkPurple">
diff --git a/apps/changelog/tailwind.config.ts b/apps/changelog/tailwind.config.ts
index b78fa42cb97ae..71c43f44b6c60 100644
--- a/apps/changelog/tailwind.config.ts
+++ b/apps/changelog/tailwind.config.ts
@@ -1,60 +1,68 @@
-const defaultTheme = require("tailwindcss/defaultTheme");
+const defaultTheme = require('tailwindcss/defaultTheme');
 
 /** @type {import('tailwindcss').Config} */
 module.exports = {
-  content: ["./src/**/*.{js,ts,jsx,tsx}"],
+  content: ['./src/**/*.{js,ts,jsx,tsx}'],
   theme: {
     extend: {
       animation: {
-        "fade-in": "fadeIn 0.35s ease-in-out",
-        "fade-in-left": "fadeInLeft 0.55s ease-in-out",
-        "fade-in-right": "fadeInRight 0.55s ease-in-out",
+        'fade-in': 'fadeIn 0.35s ease-in-out',
+        'fade-in-left': 'fadeInLeft 0.55s ease-in-out',
+        'fade-in-right': 'fadeInRight 0.55s ease-in-out',
       },
       boxShadow: {
-        DEFAULT: "var(--shadow-6)",
+        DEFAULT: 'var(--shadow-6)',
       },
       keyframes: () => ({
         fadeIn: {
-          "0%": { opacity: 0 },
-          "100%": { opacity: 1 },
+          '0%': {opacity: 0},
+          '100%': {opacity: 1},
         },
         fadeInLeft: {
-          "0%": { opacity: 0, transform: "translateX(-20px)" },
-          "100%": { opacity: 1, transform: "translateX(0)" },
+          '0%': {opacity: 0, transform: 'translateX(-20px)'},
+          '100%': {opacity: 1, transform: 'translateX(0)'},
         },
         fadeInRight: {
-          "0%": { opacity: 0, transform: "translateX(20px)" },
-          "100%": { opacity: 1, transform: "translateX(0)" },
+          '0%': {opacity: 0, transform: 'translateX(20px)'},
+          '100%': {opacity: 1, transform: 'translateX(0)'},
         },
       }),
       fontFamily: {
         sans: [
-          "var(--font-rubik)",
-          "-apple-system",
-          "BlinkMacSystemFont",
-          "Segoe UI",
-          "Helvetica",
-          "Arial",
+          'var(--font-rubik)',
+          '-apple-system',
+          'BlinkMacSystemFont',
+          'Segoe UI',
+          'Helvetica',
+          'Arial',
           ...defaultTheme.fontFamily.sans,
         ],
-        mono: "var(--font-family-monospace)",
+        mono: [
+          'Roboto Mono',
+          'SFMono-Regular',
+          'Consolas',
+          'Liberation Mono',
+          'Menlo',
+          'Courier',
+          'monospace',
+        ],
       },
       colors: {
-        primary: "#362d59",
-        pruple: "#8d5494",
-        darkPurple: "#1F1633",
-        "accent-purple": "#6A5FC1",
-        "accent-md-violet": "#584774",
-        red: "#e1567c",
-        gold: "#F1B71C",
+        primary: '#362d59',
+        pruple: '#8d5494',
+        darkPurple: '#1F1633',
+        'accent-purple': '#6A5FC1',
+        'accent-md-violet': '#584774',
+        red: '#e1567c',
+        gold: '#F1B71C',
       },
     },
   },
   plugins: [
-    require("@tailwindcss/typography"),
-    require("@tailwindcss/forms")({
-      strategy: "class",
+    require('@tailwindcss/typography'),
+    require('@tailwindcss/forms')({
+      strategy: 'class',
     }),
   ],
-  blocklist: ["collapse"],
+  blocklist: ['collapse'],
 };