diff --git a/src/components/common/Logo/Logo.module.scss b/src/components/common/Logo/Logo.module.scss
index 37662269c..05ac91d1a 100644
--- a/src/components/common/Logo/Logo.module.scss
+++ b/src/components/common/Logo/Logo.module.scss
@@ -9,7 +9,7 @@
         border-radius: 50%;
         margin-right: 1.2rem;
     }
-    .conTent{
+    .content{
         @apply font-logo sub-headline;
         font-size: var(--font-size);
     }
diff --git a/src/components/common/Logo/Logo.tsx b/src/components/common/Logo/Logo.tsx
index 06f9d57f3..96d1820e0 100644
--- a/src/components/common/Logo/Logo.tsx
+++ b/src/components/common/Logo/Logo.tsx
@@ -1,15 +1,11 @@
 import s from './Logo.module.scss'
 
-interface Props {
-    
-}
-
-const Logo = ({}: Props) => {
+const Logo = () => {
     return(
         <div className={s.logo}>
             <div className={s.eclipse}>
             </div>
-            <div className={s.conTent}>
+            <div className={s.content}>
                 ONLINE GROCERY
             </div>
         </div>
diff --git a/src/components/common/ViewAllItem/ViewAllItem.module.scss b/src/components/common/ViewAllItem/ViewAllItem.module.scss
index 41545b380..192889f1b 100644
--- a/src/components/common/ViewAllItem/ViewAllItem.module.scss
+++ b/src/components/common/ViewAllItem/ViewAllItem.module.scss
@@ -2,15 +2,15 @@
 
 .viewAll{
     display: flex;
-    color: theme("colors.primary");
+    color: var(--primary);
     .conTent{
         margin: 0.8rem 0.8rem 0.8rem 1.6rem;
         font-weight: bold;
     }
-    .vecTor{
+    .vector{
         margin: 0.8rem 0rem 0.8rem 0rem;
         svg path{
-            fill: theme("colors.primary");
+            fill: var(--primary);
         }
     }
 }
diff --git a/src/components/common/ViewAllItem/ViewAllItem.tsx b/src/components/common/ViewAllItem/ViewAllItem.tsx
index 5472525ac..6308357e4 100644
--- a/src/components/common/ViewAllItem/ViewAllItem.tsx
+++ b/src/components/common/ViewAllItem/ViewAllItem.tsx
@@ -14,7 +14,7 @@ const ViewAllItem = ({ link }: Props) => {
                     View All
                 </a>
             </Link>
-            <div className={s.vecTor}>
+            <div className={s.vector}>
                 <IconVector />
             </div>
         </div>