diff --git a/src/components/Badge/DotBadge.style.ts b/src/components/Badge/DotBadge.style.ts
index d8b704fb..435fd88d 100644
--- a/src/components/Badge/DotBadge.style.ts
+++ b/src/components/Badge/DotBadge.style.ts
@@ -1,8 +1,9 @@
 import styled from '@emotion/styled';
+import { color } from '@styles/colors';
 
 interface SuperProps {
   position: 'top' | 'middle' | 'bottom';
-  color: string;
+  color: keyof typeof color;
   badgeSize?: number;
 }
 
diff --git a/src/components/Badge/DotBadge.tsx b/src/components/Badge/DotBadge.tsx
index 62772342..817ee6c5 100644
--- a/src/components/Badge/DotBadge.tsx
+++ b/src/components/Badge/DotBadge.tsx
@@ -1,9 +1,10 @@
 import { BadgeContainer, Super } from './DotBadge.style';
+import { color } from '@styles/colors';
 
 interface BadgeProps {
   children: React.ReactNode;
   dot: boolean;
-  color: string;
+  color: keyof typeof color;
   position: 'top' | 'middle' | 'bottom';
   badgeSize?: number;
 }
diff --git a/src/components/Button/Button.tsx b/src/components/Button/Button.tsx
index addac5dc..ff8db989 100644
--- a/src/components/Button/Button.tsx
+++ b/src/components/Button/Button.tsx
@@ -1,4 +1,5 @@
 import { StyledButton } from './Buttons.style';
+import { color } from '@styles/colors';
 
 interface ButtonProps {
   width: number;
@@ -7,7 +8,7 @@ interface ButtonProps {
   label?: string;
   handleClick?: () => void;
   bold?: boolean;
-  textColor?: string;
+  textColor?: keyof typeof color;
   fontSize?: number;
   borderRadius?: number;
   children?: React.ReactNode;
diff --git a/src/components/Button/Buttons.style.ts b/src/components/Button/Buttons.style.ts
index e6324770..f06ef646 100644
--- a/src/components/Button/Buttons.style.ts
+++ b/src/components/Button/Buttons.style.ts
@@ -1,4 +1,5 @@
 import styled from '@emotion/styled';
+import { color } from '@styles/colors';
 
 export const StyledButton = styled.button<{
   width: number;
@@ -7,7 +8,7 @@ export const StyledButton = styled.button<{
   bold?: boolean;
   borderRadius?: number;
   fontSize?: number;
-  textColor?: string;
+  textColor?: keyof typeof color;
 }>`
   cursor: pointer;
   width: ${({ width }) => width}px;
diff --git a/src/components/Link/Link.tsx b/src/components/Link/Link.tsx
index 92b46fbe..ceb6827a 100644
--- a/src/components/Link/Link.tsx
+++ b/src/components/Link/Link.tsx
@@ -9,7 +9,7 @@ interface LinkProps {
   children: React.ReactNode;
   pageLink: string;
   size: number;
-  color: string;
+  state: State;
   color: keyof typeof color;
 }
 
diff --git a/src/components/ThemePicker/PickerNextButton.tsx b/src/components/ThemePicker/PickerNextButton.tsx
index 77cb9d2f..5ac016ce 100644
--- a/src/components/ThemePicker/PickerNextButton.tsx
+++ b/src/components/ThemePicker/PickerNextButton.tsx
@@ -1,8 +1,9 @@
 import { Icon } from '@components/Icon';
 import { StyledNextButton } from './ThemePicker.style';
+import { color } from '@styles/colors';
 
 interface PickerNextButtonProps {
-  color: string;
+  color: keyof typeof color;
   clickNextButton: (move: number) => void;
 }
 
diff --git a/src/components/ThemePicker/PickerPreviousButton.tsx b/src/components/ThemePicker/PickerPreviousButton.tsx
index ad6b9349..4cb20d2a 100644
--- a/src/components/ThemePicker/PickerPreviousButton.tsx
+++ b/src/components/ThemePicker/PickerPreviousButton.tsx
@@ -1,8 +1,9 @@
 import { Icon } from '@components/Icon';
 import { StyledPreviousButton } from './ThemePicker.style';
+import { color } from '@styles/colors';
 
 interface PickerPreviousButtonProps {
-  color: string;
+  color: keyof typeof color;
   clickPrevButton: (move: number) => void;
 }
 
diff --git a/src/pages/layout/components/SearchResultPost.tsx b/src/pages/layout/components/SearchResultPost.tsx
index 3c038e15..ca070aef 100644
--- a/src/pages/layout/components/SearchResultPost.tsx
+++ b/src/pages/layout/components/SearchResultPost.tsx
@@ -1,7 +1,7 @@
 import { useQuery, useQueries } from '@tanstack/react-query';
 import { searchAll } from '@apis/search';
 import { getUser } from '@apis/user';
-import { User } from '@/types';
+import { EditedPost, User } from '@/types';
 import { PostPreview } from '@components/PostPreview';
 import filterPostData from '../utils/filterPostData';
 import { FILTER } from '../constants';
@@ -55,7 +55,7 @@ const SearchResultPost = ({
 
           return (
             <PostPreview
-              post={post}
+              post={post as EditedPost}
               key={_id}
               totalLikes={likes.length}
               totalComments={comments.length}
diff --git a/src/pages/login/components/GoToSignUp.tsx b/src/pages/login/components/GoToSignUp.tsx
index d7cdca51..b9ccf37c 100644
--- a/src/pages/login/components/GoToSignUp.tsx
+++ b/src/pages/login/components/GoToSignUp.tsx
@@ -15,7 +15,7 @@ const GoToSignUp = () => {
         <Icon
           name={'arrow_forward'}
           size={14}
-          color={'red'}
+          color={'redVivid'}
         />
         &nbsp;
         <Link
diff --git a/src/utils/index.ts b/src/utils/index.ts
index aad9120e..5a6673c9 100644
--- a/src/utils/index.ts
+++ b/src/utils/index.ts
@@ -1,5 +1,5 @@
 import formatTime from './formatTime';
-import getMyFollowData from './getMyFollowData';
+import getMyFollowData from '@utils/GetMyFollowData';
 import getTotalMeditationTime from './getTotalMeditationTime';
 
 export { formatTime, getMyFollowData, getTotalMeditationTime };