diff --git a/public/fonts/lunchtype22-medium.woff2 b/public/fonts/lunchtype22-medium.woff2
new file mode 100644
index 0000000..7d85433
Binary files /dev/null and b/public/fonts/lunchtype22-medium.woff2 differ
diff --git a/public/fonts/lunchtype22-regular.woff2 b/public/fonts/lunchtype22-regular.woff2
new file mode 100644
index 0000000..76c394d
Binary files /dev/null and b/public/fonts/lunchtype22-regular.woff2 differ
diff --git a/public/fonts/lunchtype23-medium-italic.woff2 b/public/fonts/lunchtype23-medium-italic.woff2
new file mode 100644
index 0000000..34b837c
Binary files /dev/null and b/public/fonts/lunchtype23-medium-italic.woff2 differ
diff --git a/public/fonts/lunchtype23-regular-italic.woff2 b/public/fonts/lunchtype23-regular-italic.woff2
new file mode 100644
index 0000000..11e7d75
Binary files /dev/null and b/public/fonts/lunchtype23-regular-italic.woff2 differ
diff --git a/public/fonts/lunchtype24-medium-expanded.woff2 b/public/fonts/lunchtype24-medium-expanded.woff2
new file mode 100644
index 0000000..6b2bab6
Binary files /dev/null and b/public/fonts/lunchtype24-medium-expanded.woff2 differ
diff --git a/public/fonts/lunchtype24-regular-expanded.woff2 b/public/fonts/lunchtype24-regular-expanded.woff2
new file mode 100644
index 0000000..c108bec
Binary files /dev/null and b/public/fonts/lunchtype24-regular-expanded.woff2 differ
diff --git a/public/fonts/lunchtype25-medium-condensed.woff2 b/public/fonts/lunchtype25-medium-condensed.woff2
new file mode 100644
index 0000000..48a6b24
Binary files /dev/null and b/public/fonts/lunchtype25-medium-condensed.woff2 differ
diff --git a/public/fonts/lunchtype25-regular-condensed.woff2 b/public/fonts/lunchtype25-regular-condensed.woff2
new file mode 100644
index 0000000..6eae858
Binary files /dev/null and b/public/fonts/lunchtype25-regular-condensed.woff2 differ
diff --git a/src/app/fonts.css b/src/app/fonts.css
new file mode 100644
index 0000000..097ff33
--- /dev/null
+++ b/src/app/fonts.css
@@ -0,0 +1,53 @@
+@font-face {
+  font-family: lunchtype;
+  font-weight: 400;
+  src: url("/fonts/lunchtype22-regular.woff2") format("woff2");
+}
+
+@font-face {
+  font-family: lunchtype;
+  font-weight: 400;
+  font-style: italic;
+  src: url("/fonts/lunchtype22-regular-italic.woff2") format("woff2");
+}
+
+@font-face {
+  font-family: lunchtype;
+  font-weight: 500;
+  src: url("/fonts/lunchtype22-medium.woff2") format("woff2");
+}
+
+@font-face {
+  font-family: lunchtype;
+  font-weight: 500;
+  font-style: italic;
+  src: url("/fonts/lunchtype22-medium.woff2") format("woff2");
+}
+
+@font-face {
+  font-family: lunchtype;
+  font-weight: 400;
+  font-stretch: condensed;
+  src: url("/fonts/lunchtype25-regular-condensed.woff2") format("woff2");
+}
+
+@font-face {
+  font-family: lunchtype;
+  font-weight: 500;
+  font-stretch: condensed;
+  src: url("/fonts/lunchtype25-medium-condensed.woff2") format("woff2");
+}
+
+@font-face {
+  font-family: lunchtype;
+  font-weight: 400;
+  font-stretch: expanded;
+  src: url("/fonts/lunchtype24-regular-expanded.woff2") format("woff2");
+}
+
+@font-face {
+  font-family: lunchtype;
+  font-weight: 500;
+  font-stretch: expanded;
+  src: url("/fonts/lunchtype24-medium-expanded.woff2") format("woff2");
+}
diff --git a/src/app/globals.css b/src/app/globals.css
index 522ebeb..1b46c0b 100644
--- a/src/app/globals.css
+++ b/src/app/globals.css
@@ -62,8 +62,9 @@ body {
   overflow-x: hidden;
   color: var(--fg);
   background-color: var(--bg);
-  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
-    Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;
+  font-family: lunchtype, system-ui, -apple-system, BlinkMacSystemFont,
+    "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue",
+    sans-serif;
 }
 
 html,
@@ -74,7 +75,8 @@ label {
     color var(--theme-transition);
 }
 
-input:disabled, button:disabled {
+input:disabled,
+button:disabled {
   opacity: 0.5;
   cursor: not-allowed !important;
 }
diff --git a/src/app/layout.tsx b/src/app/layout.tsx
index a908d4a..1754435 100644
--- a/src/app/layout.tsx
+++ b/src/app/layout.tsx
@@ -1,5 +1,6 @@
 import ColorChanger from "@/components/ColorChanger";
 import "./globals.css";
+import "./fonts.css";
 
 export const metadata = {
   title: "gluestick",