diff --git a/class_registration_app/src/components/CourseSearch.vue b/class_registration_app/src/components/CourseSearch.vue
index 220a505..2c91ee2 100644
--- a/class_registration_app/src/components/CourseSearch.vue
+++ b/class_registration_app/src/components/CourseSearch.vue
@@ -3,11 +3,44 @@
 </script>
 
 <template>
-<div>
-
-</div>
+    <div class="container">
+        <h1>UConn Course Search</h1>
+        <input type="text" class="search-bar" placeholder="Enter course name or code">
+        <ul class="course-list">
+            <li class="course-list-item">CSE 101 - Introduction to Computer Science</li>
+            <li class="course-list-item">ENG 101 - English Composition</li>
+            <li class="course-list-item">MAT 115 - Calculus I</li>
+            <li class="course-list-item">CHEM 111 - General Chemistry</li>
+            <li class="course-list-item">HIST 200 - U.S. History</li>
+        </ul>
+    </div>
 </template>
 
 <style scoped>
+.container {
+    max-width: 600px;
+    margin: 0 auto;
+    padding: 20px;
+    background-color: #ffffff;
+    border-radius: 10px;
+    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
+}
+
+.search-bar {
+    width: 100%;
+    padding: 10px;
+    margin-bottom: 20px;
+    border: none;
+    border-radius: 5px;
+    font-size: 16px;
+}
+
+.course-list {
+    list-style: none;
+    padding: 0;
+}
 
+.course-list-item {
+    margin-bottom: 10px;
+}
 </style>
\ No newline at end of file