diff --git a/.vscode/settings.json b/.vscode/settings.json
index a89cbd32..fdec09bf 100644
--- a/.vscode/settings.json
+++ b/.vscode/settings.json
@@ -37,4 +37,7 @@
         "editor.defaultFormatter": "esbenp.prettier-vscode"
     },
     "typescript.tsdk": "node_modules/typescript/lib",
+    "tailwindCSS.includeLanguages": { 
+        "plaintext": "javascript" 
+    }
 }
diff --git a/src/views/components/calendar/CalendarHeader/CalenderHeader.tsx b/src/views/components/calendar/CalendarHeader/CalenderHeader.tsx
index 29ba99c3..e1f95e31 100644
--- a/src/views/components/calendar/CalendarHeader/CalenderHeader.tsx
+++ b/src/views/components/calendar/CalendarHeader/CalenderHeader.tsx
@@ -10,6 +10,7 @@ import RedoIcon from '~icons/material-symbols/redo';
 import SettingsIcon from '~icons/material-symbols/settings';
 import ScheduleTotalHoursAndCourses from '../../common/ScheduleTotalHoursAndCourses/ScheduleTotalHoursAndCourses';
 import CourseStatus from '../../common/CourseStatus/CourseStatus';
+import calIcon from 'src/assets/logo.png';
 
 const CalendarHeader = () => (
     <div className='min-h-79px min-w-672px flex px-0 py-15'>
@@ -19,7 +20,8 @@ const CalendarHeader = () => (
                     <Button variant='single' icon={MenuIcon} color='ut-gray' />
                     <div className='flex items-center'>
                         <LogoIcon style={{ marginRight: '5px' }} />
-                        <div className='flex flex-col gap-1 whitespace-nowrap'>
+                        <img src={calIcon} className='min-w-[48px] max-w-[48px]' alt='UT Registration Plus Logo' />
+                        <div className='flex flex-col whitespace-nowrap'>
                             <Text className='leading-trim text-cap font-roboto text-base text-ut-burntorange font-medium'>
                                 UT Registration
                             </Text>