diff --git a/src/app/app.component.html b/src/app/app.component.html
index e2da5bf..48cc614 100644
--- a/src/app/app.component.html
+++ b/src/app/app.component.html
@@ -1,2 +1,7 @@
-<blearn-header></blearn-header>
-<router-outlet></router-outlet>
+<div class="flex flex-col min-h-screen">
+  <blearn-header></blearn-header>
+  <div class="flex-1">
+    <router-outlet></router-outlet>
+  </div>
+  <blearn-footer></blearn-footer>
+</div>
diff --git a/src/app/app.component.ts b/src/app/app.component.ts
index ca5e79a..3ba7bb8 100644
--- a/src/app/app.component.ts
+++ b/src/app/app.component.ts
@@ -1,10 +1,11 @@
 import { Component } from '@angular/core';
 import { RouterOutlet } from '@angular/router';
 import {HeaderComponent} from './layout/header/header.component';
+import {FooterComponent} from './layout/footer/footer.component';
 
 @Component({
   selector: 'blearn-root',
-  imports: [RouterOutlet, HeaderComponent],
+  imports: [RouterOutlet, HeaderComponent, FooterComponent],
   templateUrl: './app.component.html',
   styleUrl: './app.component.css'
 })
diff --git a/src/app/layout/footer/footer.component.html b/src/app/layout/footer/footer.component.html
new file mode 100644
index 0000000..e400b84
--- /dev/null
+++ b/src/app/layout/footer/footer.component.html
@@ -0,0 +1,18 @@
+<footer class="w-full bg-gray-800 text-white py-6">
+  <div class="container mx-auto flex flex-col md:flex-row justify-between items-center px-4">
+    <div class="flex flex-col items-center md:items-start">
+      <span class="text-xl font-bold text-student">BLearn App</span>
+      <p class="text-xs text-gray-400 mt-2">© 2025 BLearn. All rights reserved.</p>
+    </div>
+
+    <nav class="flex flex-col mt-4 md:mt-0">
+      <a routerLink="/about" class="text-gray-400 hover:underline hover:text-white">About</a>
+    </nav>
+
+    <div class="flex items-center space-x-4 mt-4 md:mt-0">
+      <a href="https://github.com/jcasben/blearn" target="_blank" class="text-gray-400 hover:text-white hover:underline">
+        GitHub
+      </a>
+    </div>
+  </div>
+</footer>
diff --git a/src/app/layout/footer/footer.component.ts b/src/app/layout/footer/footer.component.ts
new file mode 100644
index 0000000..3f30ffa
--- /dev/null
+++ b/src/app/layout/footer/footer.component.ts
@@ -0,0 +1,13 @@
+import { Component } from '@angular/core';
+import {RouterLink} from '@angular/router';
+
+@Component({
+  selector: 'blearn-footer',
+  imports: [
+    RouterLink
+  ],
+  templateUrl: './footer.component.html',
+})
+export class FooterComponent {
+
+}