diff --git a/src/app.css b/src/app.css
index 33f90fa..88cbea2 100644
--- a/src/app.css
+++ b/src/app.css
@@ -1,6 +1,7 @@
 @tailwind base;
 @tailwind components;
 @tailwind utilities;
+
 @layer utilities {
 	/* Hide scrollbar for Chrome, Safari and Opera */
 	.no-scrollbar::-webkit-scrollbar {
@@ -12,3 +13,145 @@
 		scrollbar-width: none; /* Firefox */
 	}
 }
+
+@layer base {
+	@font-face {
+		font-family: Teko;
+		font-style: normal;
+		font-weight: 300;
+		src: url(/static/fonts/teko/Teko-Light.ttf) format('tff');
+	}
+	@font-face {
+		font-family: Teko;
+		font-style: normal;
+		font-weight: 400;
+		src: url(/static/fonts/teko/Teko-Regular.ttf) format('tff');
+	}
+	@font-face {
+		font-family: Teko;
+		font-style: normal;
+		font-weight: 500;
+		src: url(/static/fonts/teko/Teko-Medium.ttf) format('tff');
+	}
+	@font-face {
+		font-family: Teko;
+		font-style: normal;
+		font-weight: 600;
+		src: url(/static/fonts/teko/Teko-SemiBold.ttf) format('tff');
+	}
+	@font-face {
+		font-family: Teko;
+		font-style: normal;
+		font-weight: 700;
+		src: url(/static/fonts/teko/Teko-Bold.ttf) format('tff');
+	}
+
+	@font-face {
+		font-family: Poppins;
+		font-style: normal;
+		font-weight: 100;
+		src: url(/static/fonts/poppins/Poppins-Thin.ttf) format('tff');
+	}
+	@font-face {
+		font-family: Poppins;
+		font-style: italic;
+		font-weight: 100;
+		src: url(/static/fonts/poppins/Poppins-ThinItalic.ttf) format('tff');
+	}
+	@font-face {
+		font-family: Poppins;
+		font-style: normal;
+		font-weight: 200;
+		src: url(/static/fonts/poppins/Poppins-ExtraLight.ttf) format('tff');
+	}
+	@font-face {
+		font-family: Poppins;
+		font-style: italic;
+		font-weight: 200;
+		src: url(/static/fonts/poppins/Poppins-ExtraLightItalic.ttf) format('tff');
+	}
+	@font-face {
+		font-family: Poppins;
+		font-style: normal;
+		font-weight: 300;
+		src: url(/static/fonts/poppins/Poppins-Light.ttf) format('tff');
+	}
+	@font-face {
+		font-family: Poppins;
+		font-style: italic;
+		font-weight: 300;
+		src: url(/static/fonts/poppins/Poppins-LightItalic.ttf) format('tff');
+	}
+	@font-face {
+		font-family: Poppins;
+		font-style: normal;
+		font-weight: 400;
+		src: url(/static/fonts/poppins/Poppins-Regular.ttf) format('tff');
+	}
+	@font-face {
+		font-family: Poppins;
+		font-style: italic;
+		font-weight: 400;
+		src: url(/static/fonts/poppins/Poppins-Italic.ttf) format('tff');
+	}
+	@font-face {
+		font-family: Poppins;
+		font-style: normal;
+		font-weight: 500;
+		src: url(/static/fonts/poppins/Poppins-Medium.ttf) format('tff');
+	}
+	@font-face {
+		font-family: Poppins;
+		font-style: italic;
+		font-weight: 500;
+		src: url(/static/fonts/poppins/Poppins-MediumItalic.ttf) format('tff');
+	}
+	@font-face {
+		font-family: Poppins;
+		font-style: normal;
+		font-weight: 600;
+		src: url(/static/fonts/poppins/Poppins-SemiBold.ttf) format('tff');
+	}
+	@font-face {
+		font-family: Poppins;
+		font-style: italic;
+		font-weight: 600;
+		src: url(/static/fonts/poppins/Poppins-SemiBoldItalic.ttf) format('tff');
+	}
+	@font-face {
+		font-family: Poppins;
+		font-style: normal;
+		font-weight: 700;
+		src: url(/static/fonts/poppins/Poppins-Bold.ttf) format('tff');
+	}
+	@font-face {
+		font-family: Poppins;
+		font-style: italic;
+		font-weight: 700;
+		src: url(/static/fonts/poppins/Poppins-BoldItalic.ttf) format('tff');
+	}
+	@font-face {
+		font-family: Poppins;
+		font-style: normal;
+		font-weight: 800;
+		src: url(/static/fonts/poppins/Poppins-ExtraBold.ttf) format('tff');
+	}
+	@font-face {
+		font-family: Poppins;
+		font-style: italic;
+		font-weight: 800;
+		src: url(/static/fonts/poppins/Poppins-ExtraBoldItalic.ttf) format('tff');
+	}
+	@font-face {
+		font-family: Poppins;
+		font-style: normal;
+		font-weight: 900;
+		src: url(/static/fonts/poppins/Poppins-Black.ttf) format('tff');
+	}
+	@font-face {
+		font-family: Poppins;
+		font-style: italic;
+		font-weight: 900;
+		src: url(/static/fonts/poppins/Poppins-BlackItalic.ttf) format('tff');
+	}
+}
diff --git a/src/lib/components/SuccessFail.svelte b/src/lib/components/SuccessFail.svelte
index a2ffa60..a964b93 100644
--- a/src/lib/components/SuccessFail.svelte
+++ b/src/lib/components/SuccessFail.svelte
@@ -5,7 +5,7 @@
 
 <div class="fixed inset-0 flex items-center justify-center bg-eerie_black">
 	<div
-		class="grid h-dvh max-h-[48rem] w-dvw max-w-96 grid-cols-2 grid-rows-4 gap-4 p-4 text-xl font-extrabold text-white"
+		class="grid h-dvh max-h-[48rem] w-dvw max-w-96 grid-cols-2 grid-rows-4 gap-4 p-4 font-heading text-xl font-extrabold text-white"
 	>
 		<button
 			class="row-span-3 rounded-lg bg-jungle_green shadow-lg shadow-jungle_green/50"
diff --git a/src/lib/components/Timeline.svelte b/src/lib/components/Timeline.svelte
index e2bff09..1a6fd35 100644
--- a/src/lib/components/Timeline.svelte
+++ b/src/lib/components/Timeline.svelte
@@ -65,7 +65,7 @@
 			{/if}
 		{/each}
 		{#if actions.length === 0}
-			<h3 class="m-auto">No actions yet :3</h3>
+			<h3 class="m-auto font-heading font-bold">No actions yet :3</h3>
 		{/if}
 	</div>
 </button>
diff --git a/src/routes/+layout.svelte b/src/routes/+layout.svelte
index 493a0b6..71df272 100644
--- a/src/routes/+layout.svelte
+++ b/src/routes/+layout.svelte
@@ -7,6 +7,6 @@
 
 <style lang="postcss">
 	:global(body) {
-		@apply bg-eerie_black text-white;
+		@apply bg-eerie_black font-sans text-white;
 	}
 </style>
diff --git a/src/routes/+page.svelte b/src/routes/+page.svelte
index 6560c58..2a22995 100644
--- a/src/routes/+page.svelte
+++ b/src/routes/+page.svelte
@@ -1,7 +1,7 @@
 <div class="flex h-dvh flex-col items-center justify-evenly">
-	<h1 class="text-center text-5xl font-bold">hiiii :3</h1>
+	<h1 class="text-center font-heading text-5xl font-bold">hiiii :3</h1>
 	<a
-		class="rounded bg-gunmetal px-4 py-2 text-center text-2xl font-bold text-yolk_yellow"
+		class="rounded bg-gunmetal px-4 py-2 text-center font-heading text-2xl font-bold text-yolk_yellow"
 		href="/queue"
 	>
 		scout
diff --git a/src/routes/queue/+page.svelte b/src/routes/queue/+page.svelte
index 5de3f53..70bf9ec 100644
--- a/src/routes/queue/+page.svelte
+++ b/src/routes/queue/+page.svelte
@@ -21,7 +21,7 @@
 <div
 	class="grid h-full w-full grid-cols-1 grid-rows-2 place-items-center gap-4 align-middle text-4xl text-white"
 >
-	<h1 class="p-2">In Queue</h1>
+	<h1 class="p-2 font-heading font-bold">In Queue</h1>
 
 	<button class="rounded border p-4" onclick={leave}>Leave Queue</button>
 </div>
diff --git a/src/routes/scout/[team_data]/+page.svelte b/src/routes/scout/[team_data]/+page.svelte
index c62396a..404c38d 100644
--- a/src/routes/scout/[team_data]/+page.svelte
+++ b/src/routes/scout/[team_data]/+page.svelte
@@ -56,14 +56,14 @@
 
 <div class="m-auto flex h-dvh max-w-md flex-col items-center gap-2 p-2">
 	<div class="flex w-full justify-between border-b-2 border-white/10 pb-2 font-semibold">
-		<span class="flex-shrink-0">Team {data.team_key}</span>
+		<h2 class="flex-shrink-0 font-heading font-semibold">Team {data.team_key}</h2>
 		<div class="flex gap-2">
 			<button
 				onclick={phaseShiftLeft}
 				class={gamePhase === 'Auto' ? 'pointer-events-none opacity-30' : ''}
 				><ArrowLeft /></button
 			>
-			<span class="text-right">{gamePhase}: {pageName}</span>
+			<h2 class="text-right font-heading font-semibold">{gamePhase}: {pageName}</h2>
 			<button
 				onclick={phaseShiftRight}
 				class={gamePhase === 'Post' ? 'pointer-events-none opacity-30' : ''}
@@ -75,7 +75,7 @@
 	{#if gamePhase === 'Auto'}
 		<AutoActionInputs bind:furthest_auto_index bind:held bind:actions bind:pageName />
 		<button
-			class="w-full border-t-2 border-white/10 pt-2 text-center font-semibold"
+			class="w-full border-t-2 border-white/10 pt-2 text-center font-heading font-semibold"
 			onclick={(e: Event) => {
 				e.stopPropagation();
 				timelineExtended = true;
@@ -90,7 +90,7 @@
 	{:else if gamePhase === 'Tele'}
 		<TeleActionInputs bind:held bind:actions bind:pageName />
 		<button
-			class="w-full border-t-2 border-white/10 pt-2 text-center font-semibold"
+			class="w-full border-t-2 border-white/10 pt-2 text-center font-heading font-semibold"
 			onclick={(e: Event) => {
 				e.stopPropagation();
 				timelineExtended = true;
diff --git a/src/routes/scout/[team_data]/AutoActionInputs.svelte b/src/routes/scout/[team_data]/AutoActionInputs.svelte
index c96a201..a7d78d2 100644
--- a/src/routes/scout/[team_data]/AutoActionInputs.svelte
+++ b/src/routes/scout/[team_data]/AutoActionInputs.svelte
@@ -71,7 +71,9 @@
 
 <div class="align-center flex w-full max-w-md flex-grow flex-col px-2">
 	{#if is_none_state}
-		<div class="grid flex-grow grid-cols-1 grid-rows-3 gap-2 py-2 text-2xl font-bold">
+		<div
+			class="grid flex-grow grid-cols-1 grid-rows-3 gap-2 py-2 font-heading text-2xl font-bold"
+		>
 			<button class="rounded bg-gunmetal p-2" onclick={intake_piece}>Intake</button>
 			{#if held_scorables > 0}
 				<button class="rounded bg-gunmetal p-2" onclick={score_piece}>Score</button>
@@ -81,7 +83,9 @@
 			{/if}
 		</div>
 	{:else if is_intake_state}
-		<div class="grid w-full flex-grow grid-cols-2 grid-rows-2 gap-2 py-2 text-xl font-bold">
+		<div
+			class="grid w-full flex-grow grid-cols-2 grid-rows-2 gap-2 py-2 font-heading text-xl font-bold"
+		>
 			<button class="rounded bg-gunmetal p-2" onclick={() => (actionState = 'IntakeBunny')}
 				>Bunny</button
 			>
@@ -101,7 +105,9 @@
 			onclick={() => (actionState = 'None')}>Cancel</button
 		>
 	{:else if is_score_state}
-		<div class="flex w-full flex-grow flex-col items-center gap-2 py-2 text-lg font-bold">
+		<div
+			class="flex w-full flex-grow flex-col items-center gap-2 py-2 font-heading text-lg font-bold"
+		>
 			{#if held.bunnies > 0}
 				<div class="flex w-full flex-grow flex-col items-center gap-2 text-lg">
 					<h1>Bunny</h1>
@@ -160,7 +166,7 @@
 			>
 		</div>
 	{:else if is_eject_state}
-		<div class="grid w-full flex-grow grid-flow-row gap-2 py-2 font-bold">
+		<div class="grid w-full flex-grow grid-flow-row gap-2 py-2 font-heading font-bold">
 			{#if held.bunnies > 0}
 				<button
 					class="w-full rounded bg-gunmetal p-2"
diff --git a/src/routes/scout/[team_data]/TeleActionInputs.svelte b/src/routes/scout/[team_data]/TeleActionInputs.svelte
index ef3c675..4704033 100644
--- a/src/routes/scout/[team_data]/TeleActionInputs.svelte
+++ b/src/routes/scout/[team_data]/TeleActionInputs.svelte
@@ -64,7 +64,9 @@
 
 <div class="align-center flex w-full max-w-md flex-grow flex-col px-2">
 	{#if is_none_state}
-		<div class="grid flex-grow grid-cols-1 grid-rows-3 gap-2 py-2 text-2xl font-bold">
+		<div
+			class="grid flex-grow grid-cols-1 grid-rows-3 gap-2 py-2 font-heading text-2xl font-bold"
+		>
 			<button class="rounded bg-gunmetal p-2" onclick={intake_piece}>Intake</button>
 			{#if held.balloons > 0}
 				<button class="rounded bg-gunmetal p-2" onclick={score_piece}>Score</button>
@@ -74,7 +76,9 @@
 			{/if}
 		</div>
 	{:else if is_intake_state}
-		<div class="grid w-full flex-grow grid-cols-2 grid-rows-2 gap-2 py-2 text-xl font-bold">
+		<div
+			class="grid w-full flex-grow grid-cols-2 grid-rows-2 gap-2 py-2 font-heading text-xl font-bold"
+		>
 			<button
 				class="col-span-2 rounded bg-gunmetal p-2"
 				onclick={() => (actionState = 'IntakeTote')}>Tote</button
@@ -92,7 +96,9 @@
 			onclick={() => (actionState = 'None')}>Cancel</button
 		>
 	{:else if is_score_state}
-		<div class="flex w-full flex-grow flex-col items-center gap-2 py-2 text-lg font-bold">
+		<div
+			class="flex w-full flex-grow flex-col items-center gap-2 py-2 font-heading text-lg font-bold"
+		>
 			<div class="flex w-full flex-grow flex-col items-center gap-2 py-2 text-lg">
 				<h1>Ballon</h1>
 				<div class="grid w-full flex-grow grid-cols-2 grid-rows-2 gap-2">
@@ -121,7 +127,7 @@
 			>
 		</div>
 	{:else if is_eject_state}
-		<div class="grid w-full flex-grow grid-flow-row gap-2 py-2 font-bold">
+		<div class="grid w-full flex-grow grid-flow-row gap-2 py-2 font-heading font-bold">
 			{#if held.balloons > 0}
 				<button
 					class="w-full rounded bg-gunmetal p-2"
diff --git a/static/fonts/poppins/Poppins-Black.ttf b/static/fonts/poppins/Poppins-Black.ttf
new file mode 100644
index 0000000..71c0f99
Binary files /dev/null and b/static/fonts/poppins/Poppins-Black.ttf differ
diff --git a/static/fonts/poppins/Poppins-BlackItalic.ttf b/static/fonts/poppins/Poppins-BlackItalic.ttf
new file mode 100644
index 0000000..7aeb58b
Binary files /dev/null and b/static/fonts/poppins/Poppins-BlackItalic.ttf differ
diff --git a/static/fonts/poppins/Poppins-Bold.ttf b/static/fonts/poppins/Poppins-Bold.ttf
new file mode 100644
index 0000000..00559ee
Binary files /dev/null and b/static/fonts/poppins/Poppins-Bold.ttf differ
diff --git a/static/fonts/poppins/Poppins-BoldItalic.ttf b/static/fonts/poppins/Poppins-BoldItalic.ttf
new file mode 100644
index 0000000..e61e8e8
Binary files /dev/null and b/static/fonts/poppins/Poppins-BoldItalic.ttf differ
diff --git a/static/fonts/poppins/Poppins-ExtraBold.ttf b/static/fonts/poppins/Poppins-ExtraBold.ttf
new file mode 100644
index 0000000..df70936
Binary files /dev/null and b/static/fonts/poppins/Poppins-ExtraBold.ttf differ
diff --git a/static/fonts/poppins/Poppins-ExtraBoldItalic.ttf b/static/fonts/poppins/Poppins-ExtraBoldItalic.ttf
new file mode 100644
index 0000000..14d2b37
Binary files /dev/null and b/static/fonts/poppins/Poppins-ExtraBoldItalic.ttf differ
diff --git a/static/fonts/poppins/Poppins-ExtraLight.ttf b/static/fonts/poppins/Poppins-ExtraLight.ttf
new file mode 100644
index 0000000..e76ec69
Binary files /dev/null and b/static/fonts/poppins/Poppins-ExtraLight.ttf differ
diff --git a/static/fonts/poppins/Poppins-ExtraLightItalic.ttf b/static/fonts/poppins/Poppins-ExtraLightItalic.ttf
new file mode 100644
index 0000000..89513d9
Binary files /dev/null and b/static/fonts/poppins/Poppins-ExtraLightItalic.ttf differ
diff --git a/static/fonts/poppins/Poppins-Italic.ttf b/static/fonts/poppins/Poppins-Italic.ttf
new file mode 100644
index 0000000..12b7b3c
Binary files /dev/null and b/static/fonts/poppins/Poppins-Italic.ttf differ
diff --git a/static/fonts/poppins/Poppins-Light.ttf b/static/fonts/poppins/Poppins-Light.ttf
new file mode 100644
index 0000000..bc36bcc
Binary files /dev/null and b/static/fonts/poppins/Poppins-Light.ttf differ
diff --git a/static/fonts/poppins/Poppins-LightItalic.ttf b/static/fonts/poppins/Poppins-LightItalic.ttf
new file mode 100644
index 0000000..9e70be6
Binary files /dev/null and b/static/fonts/poppins/Poppins-LightItalic.ttf differ
diff --git a/static/fonts/poppins/Poppins-Medium.ttf b/static/fonts/poppins/Poppins-Medium.ttf
new file mode 100644
index 0000000..6bcdcc2
Binary files /dev/null and b/static/fonts/poppins/Poppins-Medium.ttf differ
diff --git a/static/fonts/poppins/Poppins-MediumItalic.ttf b/static/fonts/poppins/Poppins-MediumItalic.ttf
new file mode 100644
index 0000000..be67410
Binary files /dev/null and b/static/fonts/poppins/Poppins-MediumItalic.ttf differ
diff --git a/static/fonts/poppins/Poppins-Regular.ttf b/static/fonts/poppins/Poppins-Regular.ttf
new file mode 100644
index 0000000..9f0c71b
Binary files /dev/null and b/static/fonts/poppins/Poppins-Regular.ttf differ
diff --git a/static/fonts/poppins/Poppins-SemiBold.ttf b/static/fonts/poppins/Poppins-SemiBold.ttf
new file mode 100644
index 0000000..74c726e
Binary files /dev/null and b/static/fonts/poppins/Poppins-SemiBold.ttf differ
diff --git a/static/fonts/poppins/Poppins-SemiBoldItalic.ttf b/static/fonts/poppins/Poppins-SemiBoldItalic.ttf
new file mode 100644
index 0000000..3e6c942
Binary files /dev/null and b/static/fonts/poppins/Poppins-SemiBoldItalic.ttf differ
diff --git a/static/fonts/poppins/Poppins-Thin.ttf b/static/fonts/poppins/Poppins-Thin.ttf
new file mode 100644
index 0000000..03e7366
Binary files /dev/null and b/static/fonts/poppins/Poppins-Thin.ttf differ
diff --git a/static/fonts/poppins/Poppins-ThinItalic.ttf b/static/fonts/poppins/Poppins-ThinItalic.ttf
new file mode 100644
index 0000000..e26db5d
Binary files /dev/null and b/static/fonts/poppins/Poppins-ThinItalic.ttf differ
diff --git a/static/fonts/teko/Teko-Bold.ttf b/static/fonts/teko/Teko-Bold.ttf
new file mode 100644
index 0000000..f9f1e84
Binary files /dev/null and b/static/fonts/teko/Teko-Bold.ttf differ
diff --git a/static/fonts/teko/Teko-Light.ttf b/static/fonts/teko/Teko-Light.ttf
new file mode 100644
index 0000000..b80858f
Binary files /dev/null and b/static/fonts/teko/Teko-Light.ttf differ
diff --git a/static/fonts/teko/Teko-Medium.ttf b/static/fonts/teko/Teko-Medium.ttf
new file mode 100644
index 0000000..ea7ee0f
Binary files /dev/null and b/static/fonts/teko/Teko-Medium.ttf differ
diff --git a/static/fonts/teko/Teko-Regular.ttf b/static/fonts/teko/Teko-Regular.ttf
new file mode 100644
index 0000000..553ac65
Binary files /dev/null and b/static/fonts/teko/Teko-Regular.ttf differ
diff --git a/static/fonts/teko/Teko-SemiBold.ttf b/static/fonts/teko/Teko-SemiBold.ttf
new file mode 100644
index 0000000..cec8d4e
Binary files /dev/null and b/static/fonts/teko/Teko-SemiBold.ttf differ
diff --git a/tailwind.config.js b/tailwind.config.js
index a8e0cce..37606ac 100644
--- a/tailwind.config.js
+++ b/tailwind.config.js
@@ -1,8 +1,14 @@
+const defaultTheme = require('tailwindcss/defaultTheme');
+
 /** @type {import('tailwindcss').Config} */
 export default {
 	content: ['./src/**/*.{html,js,svelte,ts}'],
 	theme: {
 		extend: {
+			fontFamily: {
+				sans: ['Poppins', ...defaultTheme.fontFamily.sans],
+				heading: ['Teko', ...defaultTheme.fontFamily.sans]
+			},
 			colors: {
 				white: '#ffffff',
 				eerie_black: '#1C1C1C',