diff --git a/frontend/src/components/HomeComponents/Tasks/AddTaskDialog.tsx b/frontend/src/components/HomeComponents/Tasks/AddTaskDialog.tsx
index e0788087..bbaad655 100644
--- a/frontend/src/components/HomeComponents/Tasks/AddTaskDialog.tsx
+++ b/frontend/src/components/HomeComponents/Tasks/AddTaskDialog.tsx
@@ -125,7 +125,7 @@ export const AddTaskdialog = ({
           onClick={() => setIsOpen(true)}
         >
           Add Task
-          <Key lable="a" />
+          <Key label="a" />
         </Button>
       </DialogTrigger>
       <DialogContent>
diff --git a/frontend/src/components/HomeComponents/Tasks/TaskDialog.tsx b/frontend/src/components/HomeComponents/Tasks/TaskDialog.tsx
index 234f2efa..dfeb0352 100644
--- a/frontend/src/components/HomeComponents/Tasks/TaskDialog.tsx
+++ b/frontend/src/components/HomeComponents/Tasks/TaskDialog.tsx
@@ -1695,7 +1695,7 @@ export const TaskDialog = ({
                   id={`mark-task-complete-${task.id}`}
                   aria-label="complete task"
                 >
-                  Mark As Completed <Key lable="c" />
+                  Mark As Completed <Key label="c" />
                 </Button>
               </DialogTrigger>
               <DialogContent>
@@ -1737,7 +1737,7 @@ export const TaskDialog = ({
                   aria-label="delete task"
                 >
                   <Trash2Icon />
-                  <Key lable="d" />
+                  <Key label="d" />
                 </Button>
               </DialogTrigger>
               <DialogContent>
diff --git a/frontend/src/components/HomeComponents/Tasks/Tasks.tsx b/frontend/src/components/HomeComponents/Tasks/Tasks.tsx
index 632c07ff..daaeb5cc 100644
--- a/frontend/src/components/HomeComponents/Tasks/Tasks.tsx
+++ b/frontend/src/components/HomeComponents/Tasks/Tasks.tsx
@@ -1035,7 +1035,7 @@ export const Tasks = (
                       onChange={handleSearchChange}
                       className="flex-1 min-w-[150px]"
                       data-testid="task-search-bar"
-                      icon={<Key lable="f" />}
+                      icon={<Key label="f" />}
                     />
                     <MultiSelectFilter
                       id="projects"
@@ -1044,7 +1044,7 @@ export const Tasks = (
                       selectedValues={selectedProjects}
                       onSelectionChange={setSelectedProjects}
                       className="hidden lg:flex min-w-[140px]"
-                      icon={<Key lable="p" />}
+                      icon={<Key label="p" />}
                     />
                     <MultiSelectFilter
                       id="status"
@@ -1053,7 +1053,7 @@ export const Tasks = (
                       selectedValues={selectedStatuses}
                       onSelectionChange={setSelectedStatuses}
                       className="hidden lg:flex min-w-[140px]"
-                      icon={<Key lable="s" />}
+                      icon={<Key label="s" />}
                     />
                     <MultiSelectFilter
                       id="tags"
@@ -1062,7 +1062,7 @@ export const Tasks = (
                       selectedValues={selectedTags}
                       onSelectionChange={setSelectedTags}
                       className="hidden lg:flex min-w-[140px]"
-                      icon={<Key lable="t" />}
+                      icon={<Key label="t" />}
                     />
                     <div className="flex justify-center">
                       <AddTaskdialog
@@ -1091,7 +1091,7 @@ export const Tasks = (
                         }}
                       >
                         Sync
-                        <Key lable="r" />
+                        <Key label="r" />
                         {unsyncedTaskUuids.size > 0 && (
                           <span className="absolute -top-2 -right-2 flex h-5 w-5 items-center justify-center rounded-full bg-red-500 text-[10px] text-white font-bold shadow-sm">
                             {unsyncedTaskUuids.size}
diff --git a/frontend/src/components/ui/key-button.tsx b/frontend/src/components/ui/key-button.tsx
index d4cae30f..fdcce655 100644
--- a/frontend/src/components/ui/key-button.tsx
+++ b/frontend/src/components/ui/key-button.tsx
@@ -1,8 +1,8 @@
-export const Key = ({ lable }: { lable: string }) => {
+export const Key = ({ label }: { label: string }) => {
   return (
     <img
-      src={`https://key.pics/key/${lable.toUpperCase()}.svg?size=15&color=dark&fontStyle=Bold&fontSize=12`}
-      alt={lable}
+      src={`https://key.pics/key/${label.toUpperCase()}.svg?size=15&color=dark&fontStyle=Bold&fontSize=12`}
+      alt={label}
       className="hidden md:inline-block ml-2"
     ></img>
   );