diff --git a/apps/glimpse-graphics/package.json b/apps/glimpse-graphics/package.json
index de8a5d27..1833cba6 100644
--- a/apps/glimpse-graphics/package.json
+++ b/apps/glimpse-graphics/package.json
@@ -108,6 +108,13 @@
         "file": "image-editor.html",
         "workspace": "Images",
         "width": "8"
+      },
+      {
+        "name": "lower-third",
+        "title": "Lower Third",
+        "file": "lower-third.html",
+        "workspace": "Images",
+        "width": "8"
       }
     ],
     "graphics": [
diff --git a/apps/glimpse-graphics/src/Commentators.png b/apps/glimpse-graphics/src/Commentators.png
new file mode 100644
index 00000000..6f95dcd6
Binary files /dev/null and b/apps/glimpse-graphics/src/Commentators.png differ
diff --git a/apps/glimpse-graphics/src/Locator.png b/apps/glimpse-graphics/src/Locator.png
new file mode 100644
index 00000000..36a3dc07
Binary files /dev/null and b/apps/glimpse-graphics/src/Locator.png differ
diff --git a/apps/glimpse-graphics/src/Scoreboard.png b/apps/glimpse-graphics/src/Scoreboard.png
new file mode 100644
index 00000000..9f9bceef
Binary files /dev/null and b/apps/glimpse-graphics/src/Scoreboard.png differ
diff --git a/apps/glimpse-graphics/src/browser-common/replicants.ts b/apps/glimpse-graphics/src/browser-common/replicants.ts
index 83cff5c5..6c8a5661 100644
--- a/apps/glimpse-graphics/src/browser-common/replicants.ts
+++ b/apps/glimpse-graphics/src/browser-common/replicants.ts
@@ -108,6 +108,17 @@ export async function loadReplicants() {
 			global: await replicant<Announcement[]>("global", `glimpse-graphics.game-settings.announcements`, {defaultValue: []}),
 			team1: await replicant<Announcement[]>("team1", `glimpse-graphics.game-settings.announcements`, {defaultValue: []}),
 			team2: await replicant<Announcement[]>("team2", `glimpse-graphics.game-settings.announcements`, {defaultValue: []}),
+		},
+		lowerThird: {
+			school1Logo: await replicant<string>("school1Logo", `glimpse-graphics.images.lowerThird`, {defaultValue: ""}),
+			school2Logo: await replicant<string>("school2Logo", `glimpse-graphics.images.lowerThird`, {defaultValue: ""}),
+			scoreboard: await replicant<boolean>("scoreboard", `glimpse-graphics.images.lowerThird`, {defaultValue: false}),
+			locator: await replicant<boolean>("locator", `glimpse-graphics.images.lowerThird`, {defaultValue: false}),
+			commentators: {
+				show: await replicant<boolean>("commentators", `glimpse-graphics.images.lowerThird`, {defaultValue: false}),
+				leftPerson: await replicant<string>("leftPerson", `glimpse-graphics.images.lowerThird`, {defaultValue: "Dan Bahl"}),
+				rightPerson: await replicant<string>("rightPerson", `glimpse-graphics.images.lowerThird`, {defaultValue: "Dan Fridgen"})
+			},
 		}
 	}
 }
diff --git a/apps/glimpse-graphics/src/dashboard/lower-third.ts b/apps/glimpse-graphics/src/dashboard/lower-third.ts
new file mode 100644
index 00000000..35038d32
--- /dev/null
+++ b/apps/glimpse-graphics/src/dashboard/lower-third.ts
@@ -0,0 +1,7 @@
+import { createApp } from 'vue';
+import App from './lower-third/main.vue';
+import {pinia} from "./pinia";
+
+const app = createApp(App);
+app.use(pinia);
+app.mount('#app');
diff --git a/apps/glimpse-graphics/src/dashboard/lower-third/LowerThird.vue b/apps/glimpse-graphics/src/dashboard/lower-third/LowerThird.vue
new file mode 100644
index 00000000..79a3d6cb
--- /dev/null
+++ b/apps/glimpse-graphics/src/dashboard/lower-third/LowerThird.vue
@@ -0,0 +1,42 @@
+<template>
+	<div>
+		<n-input :on-update-value="(string) => replicants.lowerThird.school1Logo.value = string"
+				 :default-value="replicants.lowerThird.school1Logo.value"
+				 :style="{'max-width': '40%', 'margin-right': '20px'}" placeholder="URL for team 1's logo"/>
+		<n-input :on-update-value="(string) => replicants.lowerThird.school2Logo.value = string"
+				 :default-value="replicants.lowerThird.school2Logo.value"
+				 :style="{'max-width': '40%', 'margin-right': '20px'}" placeholder="URL for team 2's logo"/>
+		<h2>Display Scoreboard</h2>
+		<n-button @click="replicants.lowerThird.scoreboard.value = !replicants.lowerThird.scoreboard.value">
+			{{ replicants.lowerThird.scoreboard.value ? "Hide" : "Show" }}
+		</n-button>
+		<h2>Display Commentators/Interviewer and Interviewee</h2>
+		<n-input :on-update:value="(string) => replicants.lowerThird.commentators.leftPerson.value = string"
+				 :default-value="replicants.lowerThird.commentators.leftPerson.value"
+				 :style="{'max-width': '40%', 'margin-right': '20px'}" placeholder="Left Person"/>
+		<n-input :on-update:value="(string) => replicants.lowerThird.commentators.rightPerson.value = string"
+				 :default-value="replicants.lowerThird.commentators.rightPerson.value" style="max-width: 40%"
+				 placeholder="Right Person"/>
+		<n-button @click="replicants.lowerThird.commentators.show.value = !replicants.lowerThird.commentators.show.value"
+				  style="margin-left: 20px">
+			{{ replicants.lowerThird.commentators.show.value ? "Hide" : "Show" }}
+		</n-button>
+		<h2>Display Locator</h2>
+		<n-button @click="replicants.lowerThird.locator.value = !replicants.lowerThird.locator.value">
+			{{ replicants.lowerThird.locator.value ? "Hide" : "Show" }}
+		</n-button>
+	</div>
+</template>
+
+<script setup lang="ts">
+import {NButton, NInput} from "naive-ui"
+import { loadReplicants } from "../../browser-common/replicants";
+import {ref} from "vue";
+
+const replicants = await loadReplicants();
+
+
+</script>
+
+<style scoped>
+</style>
diff --git a/apps/glimpse-graphics/src/dashboard/lower-third/main.vue b/apps/glimpse-graphics/src/dashboard/lower-third/main.vue
new file mode 100644
index 00000000..5323ae7b
--- /dev/null
+++ b/apps/glimpse-graphics/src/dashboard/lower-third/main.vue
@@ -0,0 +1,22 @@
+<template>
+	<n-config-provider :theme="darkTheme">
+		<Suspense>
+			<div>
+				<LowerThird />
+			</div>
+			<template #fallback>
+				Loading...
+			</template>
+		</Suspense>
+	</n-config-provider>
+</template>
+
+<script setup lang="ts">
+import {NConfigProvider, darkTheme} from "naive-ui";
+import LowerThird from "./LowerThird.vue";
+
+</script>
+
+<style scoped>
+
+</style>
diff --git a/apps/glimpse-graphics/src/graphics/glimpse/StyledView.vue b/apps/glimpse-graphics/src/graphics/glimpse/StyledView.vue
index f55b99a5..2c8318b9 100644
--- a/apps/glimpse-graphics/src/graphics/glimpse/StyledView.vue
+++ b/apps/glimpse-graphics/src/graphics/glimpse/StyledView.vue
@@ -3,6 +3,7 @@
 		<div v-if="replicants.gameSettings.style.value === 'espn'">
 			<ESPNImageView />
 			<ESPNScoreboardView />
+			<ESPNLowerThird />
 		</div>
 		<div v-else-if="replicants.gameSettings.style.value === 'rpitv-modern'">
 			<TVModernImageView />
@@ -18,6 +19,7 @@ import ESPNScoreboardView from "./styles/espn/ScoreboardView.vue";
 import ESPNImageView from "./styles/espn/ImageView.vue";
 import TVModernScoreboardView from "./styles/rpitv-modern/ScoreboardView.vue";
 import TVModernImageView from "./styles/rpitv-modern/ImageView.vue";
+import ESPNLowerThird from "./styles/espn/LowerThird.vue";
 
 const replicants = await loadReplicants();
 </script>
diff --git a/apps/glimpse-graphics/src/graphics/glimpse/styles/espn/LowerThird.vue b/apps/glimpse-graphics/src/graphics/glimpse/styles/espn/LowerThird.vue
new file mode 100644
index 00000000..258afbdd
--- /dev/null
+++ b/apps/glimpse-graphics/src/graphics/glimpse/styles/espn/LowerThird.vue
@@ -0,0 +1,32 @@
+<template>
+	<div :class="{show: replicants.lowerThird.scoreboard.value, hide: !replicants.lowerThird.scoreboard.value}">
+		<Scoreboard />
+	</div>
+	<div :class="{show: replicants.lowerThird.commentators.show.value, hide: !replicants.lowerThird.commentators.show.value}">
+		<Commentators />
+	</div>
+	<div :class="{show: replicants.lowerThird.locator.value, hide: !replicants.lowerThird.locator.value}">
+		<Locator />
+	</div>
+</template>
+
+<script setup lang="ts">
+import Scoreboard from "./lower-third/Scoreboard.vue";
+import Commentators from "./lower-third/Commentators.vue";
+import Locator from "./lower-third/Locator.vue";
+import {loadReplicants} from "../../../../browser-common/replicants";
+
+const replicants = await loadReplicants();
+
+</script>
+
+<style scoped>
+.hide {
+	opacity: 0;
+	transition: 1s;
+}
+.show {
+	opacity: 1;
+	transition: 1s;
+}
+</style>
diff --git a/apps/glimpse-graphics/src/graphics/glimpse/styles/espn/lower-third/Commentators.vue b/apps/glimpse-graphics/src/graphics/glimpse/styles/espn/lower-third/Commentators.vue
new file mode 100644
index 00000000..5b793b0e
--- /dev/null
+++ b/apps/glimpse-graphics/src/graphics/glimpse/styles/espn/lower-third/Commentators.vue
@@ -0,0 +1,46 @@
+<template>
+	<img :src="commentators">
+	<div id="leftPerson">{{replicants.lowerThird.commentators.leftPerson.value}}</div>
+	<div id="rightPerson">{{replicants.lowerThird.commentators.rightPerson.value}}</div>
+</template>
+
+<script setup lang="ts">
+import commentators from "../../../../../Commentators.png"
+import { loadReplicants } from "../../../../../browser-common/replicants";
+
+const replicants = await loadReplicants();
+</script>
+
+<style scoped>
+@font-face {
+	font-family: "swiss721_med";
+	src: url('Swiss721Medium.ttf')
+}
+div {
+	position: absolute;
+	font-family: "swiss721_med";
+	color: rgb(63, 64, 59);
+}
+img {
+	position: absolute;
+	top: 0;
+	left: 0;
+	width: 100vw;
+	height: 100vh;
+	transition: opacity 1s;
+}
+#leftPerson {
+	left: 0;
+	width: 55.6vw;
+	text-align: center;
+	bottom: 17.5vh;
+	font-size: 3.5vh;
+}
+#rightPerson {
+	left: 0;
+	width: 144.3vw;
+	text-align: center;
+	bottom: 17.5vh;
+	font-size: 3.5vh;
+}
+</style>
diff --git a/apps/glimpse-graphics/src/graphics/glimpse/styles/espn/lower-third/Locator.vue b/apps/glimpse-graphics/src/graphics/glimpse/styles/espn/lower-third/Locator.vue
new file mode 100644
index 00000000..2b3eae48
--- /dev/null
+++ b/apps/glimpse-graphics/src/graphics/glimpse/styles/espn/lower-third/Locator.vue
@@ -0,0 +1,108 @@
+<template>
+	<img :src="Locator">
+	<div id="team1SecondaryColor" :style="{'background-color': replicants.teams[0].secondaryColor.value}"></div>
+	<div id="team1PrimaryColor" :style="{'background-color': replicants.teams[0].primaryColor.value}"></div>
+	<div id="team2SecondaryColor" :style="{'background-color': replicants.teams[1].secondaryColor.value}"></div>
+	<div id="team2PrimaryColor" :style="{'background-color': replicants.teams[1].primaryColor.value}"></div>
+	<div class="team1Logo">
+		<img id="team1Logo" :src="replicants.lowerThird.school1Logo.value">
+	</div>
+	<div class="team2Logo">
+		<img id="team2Logo" :src="replicants.lowerThird.school2Logo.value">
+	</div>
+	<div class="team1Name">{{replicants.teams[0].name.value}}</div>
+	<div class="team2Name">{{replicants.teams[1].name.value}}</div>
+</template>
+
+<script setup lang="ts">
+import Locator from "../../../../../Locator.png"
+import {loadReplicants} from "../../../../../browser-common/replicants";
+
+const replicants = await loadReplicants();
+</script>
+
+<style scoped>
+@font-face {
+	font-family: "swiss721_heavy";
+	src: url('Swiss721Heavy.ttf')
+}
+div {
+	position: absolute;
+	font-family: "swiss721_heavy";
+}
+img {
+	position: absolute;
+	top: 0;
+	left: 0;
+	width: 100vw;
+	height: 100vh;
+}
+#team1SecondaryColor {
+	left: 29.5vw;
+	bottom: 22.1vh;
+	width: 2.7vw;
+	height: 9.6vh;
+}
+#team1PrimaryColor {
+	left: 32.4vw;
+	bottom: 22.1vh;
+	width: 11.8vw;
+	height: 9.6vh;
+}
+#team2SecondaryColor {
+	left: 67.6vw;
+	width: 2.7vw;
+	bottom: 22.1vh;
+	height: 9.6vh;
+}
+#team2PrimaryColor {
+	left: 55.6vw;
+	bottom: 22.1vh;
+	width: 11.9vw;
+	height: 9.6vh;
+}
+.team1Logo {
+	left: 0;
+	bottom: 22.4vh;
+	width: 76.67vw;
+	display: flex;
+	justify-content: center;
+}
+#team1Logo {
+	position: relative;
+	height: auto;
+	width: auto;
+	max-width: 11.9vw;
+	max-height: 9vh;
+}
+.team2Logo {
+	left: 0;
+	bottom: 22.4vh;
+	width: 123vw;
+	display: flex;
+	justify-content: center;
+}
+#team2Logo {
+	position: relative;
+	height: auto;
+	width: auto;
+	max-width: 11.9vw;
+	max-height: 9vh;
+}
+.team1Name {
+	left: 0;
+	color: rgba(63,63,63);
+	font-size: 3.5vh;
+	width: 75.9vw;
+	text-align: center;
+	bottom: 16.1vh;
+}
+.team2Name {
+	left: 0;
+	color: rgba(63,63,63);
+	font-size: 3.5vh;
+	width: 123.5vw;
+	text-align: center;
+	bottom: 16.1vh;
+}
+</style>
diff --git a/apps/glimpse-graphics/src/graphics/glimpse/styles/espn/lower-third/Scoreboard.vue b/apps/glimpse-graphics/src/graphics/glimpse/styles/espn/lower-third/Scoreboard.vue
new file mode 100644
index 00000000..ec51a992
--- /dev/null
+++ b/apps/glimpse-graphics/src/graphics/glimpse/styles/espn/lower-third/Scoreboard.vue
@@ -0,0 +1,199 @@
+<template>
+	<img :src="scoreboard" alt="lower_third">
+	<div id="team1Name" class="lower-third" :style="{'color': replicants.teams[0].primaryColor.value}">
+		{{replicants.teams[0].name.value}}
+	</div>
+	<div  id="team1Score" class="lower-third">
+		{{replicants.teams[0].score.value}}
+	</div>
+	<div id="team2Name" class="lower-third" :style="{'color': replicants.teams[1].primaryColor.value}">
+		{{replicants.teams[1].name.value}}
+	</div>
+	<div  id="team2Score" class="lower-third">
+		{{replicants.teams[1].score.value}}
+	</div>
+	<div id="gamePeriod" class="lower-third">
+		{{ period }}
+	</div>
+	<div class="colors" id="team1PrimaryColor" :style="{'background-color': replicants.teams[0].primaryColor.value}"></div>
+	<div class="colors" id="team1SecondaryColor" :style="{'background-color': replicants.teams[0].secondaryColor.value}"></div>
+	<div class="colors" id="team2PrimaryColor" :style="{'background-color': replicants.teams[1].primaryColor.value}"></div>
+	<div class="colors" id="team2SecondaryColor" :style="{'background-color': replicants.teams[1].secondaryColor.value}"></div>
+	<div class="team1Logo">
+		<img id="team1Logo" :src="replicants.lowerThird.school1Logo.value">
+	</div>
+	<div class="team2Logo">
+		<img id="team2Logo" :src="replicants.lowerThird.school2Logo.value">
+	</div>
+</template>
+
+<script setup lang="ts">
+import {loadReplicants} from "../../../../../browser-common/replicants";
+import {computed} from "vue";
+import scoreboard from "../../../../../Scoreboard.png";
+import { replace } from "lodash";
+
+const replicants = await loadReplicants();
+
+const period = computed(() => {
+	console.log(replicants.scoreboard.period.value);
+	if (replicants.scoreboard.period.value === 1)
+		return "End of 1st";
+	if (replicants.scoreboard.period.value === 2)
+		return "End of 2nd";
+	// If the team's score are the same and we're nearing the third period...
+	if (replicants.teams[0].score.value === replicants.teams[1].score.value) {
+		if (replicants.scoreboard.period.value === 3) 
+			return "End of Reg.";
+		// If there is no shootout...
+		if (!replicants.gameSettings.periods.shootouts.value) {
+			// If there is no 2nd overtime...
+			if (replicants.scoreboard.period.value === 4 && replicants.gameSettings.periods.overtime.count.value < 2)
+				return "Final OT";
+			// If there is 2nd overtime...
+			if (replicants.scoreboard.period.value === 4 && replicants.gameSettings.periods.overtime.count.value >= 2)
+				return "End 1st OT";
+			if (replicants.scoreboard.period.value === 5)
+				return "Final OT";
+		}
+		// If there is shootout...
+		if (replicants.gameSettings.periods.shootouts.value) {
+			// If there is no 2nd overtime...
+			if (replicants.scoreboard.period.value === 4 && replicants.gameSettings.periods.overtime.count.value < 2)
+				return "End of OT";
+			if (replicants.scoreboard.period.value === 5 && replicants.gameSettings.periods.overtime.count.value < 2)
+				return "Final SO";
+			// If there is 2nd overtime...
+			if (replicants.scoreboard.period.value === 4 && replicants.gameSettings.periods.overtime.count.value === 2)
+				return "End 1st OT";
+			if (replicants.scoreboard.period.value === 5 && replicants.gameSettings.periods.overtime.count.value === 2)
+				return "End 2nd OT";
+			if (replicants.scoreboard.period.value === 6 && replicants.gameSettings.periods.overtime.count.value === 2)
+				return "Final SO";
+		}
+	}
+	// If the team's score are not the same and we're at/past the third period...
+	if (replicants.scoreboard.period.value === 3)
+		return "Final";
+	// If there is no shootout...
+	if (!replicants.gameSettings.periods.shootouts.value && replicants.scoreboard.period.value >= 4)
+		return "Final OT";
+	// If there is shootout...
+	if (replicants.gameSettings.periods.shootouts.value && replicants.scoreboard.period.value >= 4) {
+		if (replicants.scoreboard.period.value >= 4 && replicants.scoreboard.period.value <= 5)
+			return "Final OT";
+		if (replicants.scoreboard.period.value === 6)
+			return "Final SO";
+	}
+})
+</script>
+
+<style scoped>
+@font-face {
+	font-family: "swiss721_heavy";
+	src: url('Swiss721Heavy.ttf')
+}
+div {
+	position: absolute;
+	font-family: "swiss721_heavy";
+}
+img {
+	position: absolute;
+	top: 0;
+	left: 0;
+	width: 100vw;
+	height: 100vh;
+
+	transition: opacity 1s;
+}
+#gamePeriod {
+	font-style: italic;
+}
+.lower-third {
+	left: 0;
+	text-align: center;
+}
+#team1Name {
+	font-size: 3.47vh;
+	width: 76vw;
+	bottom: 16.67vh;
+	height: 3.47vh;
+}
+#team1Score {
+	font-size: 5.7vh;
+	width: 84.5vw;
+	bottom: 23.7vh;
+	height: 5.7vh;
+}
+#team2Name {
+	font-size: 3.47vh;
+	width: 123.54vw;
+	bottom: 16.67vh;
+	height: 3.47vh;
+}
+#team2Score {
+	font-size: 5.7vh;
+	width: 115.15vw;
+	bottom: 23.7vh;
+	height: 5.7vh;
+}
+#gamePeriod {
+	font-size: 2.36vh;
+	width: 99.8vw;
+	bottom: 12.75vh;
+	height: 2.36vh;
+	color: white;
+}
+.colors {
+	height: 9.6vh;
+	bottom: 21.8vh;
+}
+#team1SecondaryColor {
+	left: 28.6vw;
+	width: 1.84vw;
+}
+#team1PrimaryColor {
+	left: 30.7vw;
+	width: 8vw;
+}
+#team2SecondaryColor {
+	left: 69.3vw;
+	width: 1.93vw;
+}
+#team2PrimaryColor {
+	left: 61.1vw;
+	width: 8.1vw;
+}
+.team1Logo {
+	left: 0;
+	top: 0;
+	width: 69.4vw;
+	height: 147vh;
+	display: flex;
+	justify-content: center;
+}
+.team2Logo{
+	left: 0;
+	top: 0;
+	width: 130vw;
+	height: 147vh;
+	display: flex;
+	justify-content: center;
+}
+#team1Logo {
+	position: relative;
+	margin: auto;
+	max-width: 8vw;
+	max-height: 9vh;
+	height: auto;
+	width: auto;
+}
+#team2Logo {
+	position: relative;
+	margin: auto;
+	max-width: 8vw;
+	max-height: 9vh;
+	height: auto;
+	width: auto;
+}
+</style>
diff --git a/apps/glimpse-graphics/src/graphics/glimpse/styles/espn/lower-third/Swiss721Heavy.ttf b/apps/glimpse-graphics/src/graphics/glimpse/styles/espn/lower-third/Swiss721Heavy.ttf
new file mode 100644
index 00000000..289c8cf6
Binary files /dev/null and b/apps/glimpse-graphics/src/graphics/glimpse/styles/espn/lower-third/Swiss721Heavy.ttf differ
diff --git a/apps/glimpse-graphics/src/graphics/glimpse/styles/espn/lower-third/Swiss721Medium.ttf b/apps/glimpse-graphics/src/graphics/glimpse/styles/espn/lower-third/Swiss721Medium.ttf
new file mode 100644
index 00000000..e5ec590f
Binary files /dev/null and b/apps/glimpse-graphics/src/graphics/glimpse/styles/espn/lower-third/Swiss721Medium.ttf differ