diff --git a/src/pages/game/game.tsx b/src/pages/game/game.tsx
index 29fd68fe..e745a6aa 100644
--- a/src/pages/game/game.tsx
+++ b/src/pages/game/game.tsx
@@ -120,7 +120,7 @@ const Game = () => {
   }, [gameMatchData, setHeaderTitle]);
 
   return (
-    <div className="relative h-full flex-col gap-[1.2rem] px-[1.6rem] pt-[2rem]">
+    <div className="relative h-full flex-col gap-[1.2rem] bg-gray-100 px-[1.6rem] pt-[2rem]">
       {gameMatchData?.result?.map((match) => (
         // TODO: 매칭 현황 상태가 [그룹원 모집중]인 카드만 노출
         <button
diff --git a/src/pages/home/home.tsx b/src/pages/home/home.tsx
index 41c05813..74736bdd 100644
--- a/src/pages/home/home.tsx
+++ b/src/pages/home/home.tsx
@@ -5,6 +5,7 @@ import Button from '@components/button/button/button';
 import { WEEK_CALENDAR_START_OFFSET } from '@components/calendar/constants/CALENDAR';
 import Dialog from '@components/dialog/dialog';
 import { TAB_TYPES, type TabType } from '@components/tab/tab/constants/tab-type';
+import { CREATE_MATCH_TOAST_MESSAGE } from '@constants/error-toast';
 import useAuth from '@hooks/use-auth';
 import { useTabState } from '@hooks/use-tab-state';
 import { gaEvent } from '@libs/analytics';
@@ -19,8 +20,9 @@ import { ROUTES } from '@routes/routes-config';
 import { useMutation } from '@tanstack/react-query';
 import { addDays, format } from 'date-fns';
 import { useEffect, useState } from 'react';
-import { useNavigate } from 'react-router-dom';
+import { useLocation, useNavigate } from 'react-router-dom';
 import { handleScrollLock } from '@/shared/utils/scroll-lock';
+import { showErrorToast } from '@/shared/utils/show-error-toast';
 
 // TODO: 선택 날짜 유지 로직 수정
 // const getSelectedDateFromQuery = (searchParams: URLSearchParams, fallbackDate: Date): Date => {
@@ -32,6 +34,7 @@ import { handleScrollLock } from '@/shared/utils/scroll-lock';
 
 const Home = () => {
   const { activeType, changeTab } = useTabState();
+  const location = useLocation();
   const navigate = useNavigate();
   // const [searchParams, setSearchParams] = useSearchParams();
   const entryDate = new Date();
@@ -68,6 +71,21 @@ const Home = () => {
     gaEvent('home_enter', { from });
   }, [needsMatchingSetup]);
 
+  useEffect(() => {
+    if (location.state?.shouldShowMatchCreatedToast) {
+      showErrorToast(CREATE_MATCH_TOAST_MESSAGE, {
+        offset: '8.8rem',
+        icon: false,
+        className: 'bg-sub-900 text-gray-black cap_14_sb',
+      });
+
+      navigate(location.pathname, {
+        replace: true,
+        state: {},
+      });
+    }
+  }, [location, navigate]);
+
   // const syncSelectedDateToQuery = (date: Date) => {
   //   const nextParams = new URLSearchParams(searchParams);
   //   nextParams.set('date', format(date, 'yyyy-MM-dd'));
diff --git a/src/pages/onboarding/components/complete-button-section.tsx b/src/pages/onboarding/components/complete-button-section.tsx
index 308e39d6..e1929dc6 100644
--- a/src/pages/onboarding/components/complete-button-section.tsx
+++ b/src/pages/onboarding/components/complete-button-section.tsx
@@ -1,14 +1,67 @@
+import { matchMutations } from '@apis/match/match-mutations';
+import { matchQueries } from '@apis/match/match-queries';
 import Button from '@components/button/button/button';
+import { gaEvent } from '@libs/analytics';
 import { ROUTES } from '@routes/routes-config';
+import { useMutation, useQueryClient } from '@tanstack/react-query';
 import { useNavigate } from 'react-router-dom';
+import type { SelectedGame } from './date-select';
 
-const CompleteButtonSection = () => {
+interface CompleteButtonSectionProps {
+  pendingMatch: {
+    game: SelectedGame;
+    date: string;
+    type: 'single' | 'group';
+  };
+}
+
+const CompleteButtonSection = ({ pendingMatch }: CompleteButtonSectionProps) => {
   const navigate = useNavigate();
+  const queryClient = useQueryClient();
+  const createMatchMutation = useMutation(matchMutations.CREATE_MATCH());
 
   const handleGoToMate = () => {
     navigate(ROUTES.HOME);
   };
 
+  const handleCreate = () => {
+    if (createMatchMutation.isPending) return;
+
+    const matchType = pendingMatch.type === 'single' ? 'DIRECT' : 'GROUP';
+    const gaMatchType = pendingMatch.type === 'single' ? 'one_to_one' : 'group';
+
+    gaEvent('match_create_click', {
+      match_type: gaMatchType,
+      role: 'creator',
+    });
+
+    createMatchMutation.mutate(
+      {
+        gameId: pendingMatch.game.id,
+        matchType,
+      },
+      {
+        onSuccess: () => {
+          if (matchType === 'DIRECT') {
+            queryClient.invalidateQueries({
+              queryKey: matchQueries.SINGLE_MATCH_LIST(pendingMatch.date).queryKey,
+            });
+          } else {
+            queryClient.invalidateQueries({
+              queryKey: matchQueries.GROUP_MATCH_LIST(pendingMatch.date).queryKey,
+            });
+          }
+
+          navigate(ROUTES.HOME, {
+            state: {
+              shouldShowMatchCreatedToast: true,
+            },
+          });
+        },
+      },
+    );
+  };
+
   return (
     <div className="w-full">
       <section className="w-full flex-row-between gap-[0.8rem] p-[1.6rem]">
@@ -24,7 +77,8 @@ const CompleteButtonSection = () => {
           size="M"
           variant="blue"
           className="w-full"
-          onClick={handleGoToMate}
+          onClick={handleCreate}
+          disabled={createMatchMutation.isPending}
         />
       </section>
     </div>
diff --git a/src/pages/onboarding/components/complete-group-card.tsx b/src/pages/onboarding/components/complete-group-card.tsx
index f4faa6ec..7f6fb26b 100644
--- a/src/pages/onboarding/components/complete-group-card.tsx
+++ b/src/pages/onboarding/components/complete-group-card.tsx
@@ -7,12 +7,20 @@ const CompleteGroupCard = ({ matchId }: { matchId: number }) => {
   const { data } = useSuspenseQuery(matchQueries.GROUP_MATCH_RESULT(matchId));
 
   const cardProps: CardProps = {
-    ...data,
-    type: 'group',
+    id: data.id,
+    type: 'game',
+    nickname: data.nickname,
+    count: data.count,
+    imgUrl: Array.isArray(data.imgUrl) ? data.imgUrl : [data.imgUrl],
+    awayTeam: data.awayTeam,
+    homeTeam: data.homeTeam,
+    stadium: data.stadium,
+    date: data.date,
+    isGroup: true,
     className: 'w-full',
   };
 
-  return <Card isCreated {...cardProps} />;
+  return <Card {...cardProps} />;
 };
 
 export default CompleteGroupCard;
diff --git a/src/pages/onboarding/components/complete-single-card.tsx b/src/pages/onboarding/components/complete-single-card.tsx
index 1daa7ec1..f93af572 100644
--- a/src/pages/onboarding/components/complete-single-card.tsx
+++ b/src/pages/onboarding/components/complete-single-card.tsx
@@ -1,20 +1,26 @@
 import { matchQueries } from '@apis/match/match-queries';
 import Card from '@components/card/match-card/card';
-import type { CardProps, ChipColor } from '@components/card/match-card/types/card';
+import type { CardProps } from '@components/card/match-card/types/card';
 import { useSuspenseQuery } from '@tanstack/react-query';
 
 const CompleteSingleCard = ({ matchId }: { matchId: number }) => {
   const { data } = useSuspenseQuery(matchQueries.SINGLE_MATCH_RESULT(matchId));
 
   const cardProps: CardProps = {
-    ...data,
-    type: 'single',
+    id: data.id,
+    type: 'game',
+    nickname: data.nickname,
+    count: 1,
     imgUrl: [data.imgUrl],
-    chips: [data.team, data.style] as ChipColor[],
+    awayTeam: data.awayTeam,
+    homeTeam: data.homeTeam,
+    stadium: data.stadium,
+    date: data.date,
+    isGroup: false,
     className: 'w-full',
   };
 
-  return <Card isCreated {...cardProps} />;
+  return <Card {...cardProps} />;
 };
 
 export default CompleteSingleCard;
diff --git a/src/pages/onboarding/components/complete.tsx b/src/pages/onboarding/components/complete.tsx
index 3a4fccb8..b200756d 100644
--- a/src/pages/onboarding/components/complete.tsx
+++ b/src/pages/onboarding/components/complete.tsx
@@ -1,14 +1,39 @@
+import { userQueries } from '@apis/user/user-queries';
+import Card from '@components/card/match-card/card';
+import type { CardProps } from '@components/card/match-card/types/card';
 import { MATCHING_SUGGESTION_MESSAGE_TITLE } from '@pages/match/constants/matching';
-import CompleteGroupCard from './complete-group-card';
-import CompleteSingleCard from './complete-single-card';
+import { useQuery } from '@tanstack/react-query';
+import type { SelectedGame } from './date-select';
 
 interface CompleteProps {
-  nickname: string;
-  matchId: number;
+  selectedGame: SelectedGame;
+  selectedDate: string;
   type?: 'single' | 'group';
 }
 
-const Complete = ({ nickname, matchId, type }: CompleteProps) => {
+const Complete = ({ selectedGame, selectedDate, type }: CompleteProps) => {
+  const { data } = useQuery({
+    ...userQueries.USER_INFO(),
+    enabled: true,
+  });
+
+  const nickname = data?.nickname ?? '사용자';
+  const imgUrl = data?.imgUrl ?? '';
+
+  const cardProps: CardProps = {
+    id: selectedGame.id,
+    type: 'game',
+    nickname,
+    count: 1,
+    imgUrl: imgUrl ? [imgUrl] : [],
+    awayTeam: selectedGame.awayTeam,
+    homeTeam: selectedGame.homeTeam,
+    stadium: selectedGame.stadium,
+    date: selectedDate,
+    isGroup: type === 'group',
+    className: 'w-full',
+  };
+
   return (
     <div className="w-full flex-1 flex-col-between gap-[4rem] whitespace-pre-line pt-[6.45rem]">
       <div className="w-full flex-col gap-[4rem] px-[1.6rem]">
@@ -16,11 +41,7 @@ const Complete = ({ nickname, matchId, type }: CompleteProps) => {
           {MATCHING_SUGGESTION_MESSAGE_TITLE(nickname)}
         </p>
 
-        {type === 'single' ? (
-          <CompleteSingleCard matchId={matchId} />
-        ) : (
-          <CompleteGroupCard matchId={matchId} />
-        )}
+        <Card {...cardProps} />
       </div>
     </div>
   );
diff --git a/src/pages/onboarding/components/date-select.tsx b/src/pages/onboarding/components/date-select.tsx
index cce8627f..8b0af52d 100644
--- a/src/pages/onboarding/components/date-select.tsx
+++ b/src/pages/onboarding/components/date-select.tsx
@@ -11,8 +11,16 @@ import { format } from 'date-fns';
 import { useState } from 'react';
 import { showErrorToast } from '@/shared/utils/show-error-toast';
 
+export interface SelectedGame {
+  id: number;
+  awayTeam: string;
+  homeTeam: string;
+  gameTime: string;
+  stadium: string;
+}
+
 interface DateSelectProps {
-  onComplete: (matchId: number) => void;
+  onComplete: (selected: { game: SelectedGame; date: string }) => void;
   activeType: TabType;
 }
 
@@ -71,7 +79,7 @@ const DateSelect = ({ onComplete, activeType }: DateSelectProps) => {
         date={format(selectedDate ?? new Date(), 'yyyy-MM-dd')}
         gameSchedule={data ?? []}
         activeType={activeType}
-        fromOnboarding={true}
+        fromOnboarding
         onComplete={onComplete}
       />
     </div>
diff --git a/src/pages/onboarding/onboarding.tsx b/src/pages/onboarding/onboarding.tsx
index 488cea0a..c071aca1 100644
--- a/src/pages/onboarding/onboarding.tsx
+++ b/src/pages/onboarding/onboarding.tsx
@@ -1,11 +1,10 @@
 import { matchMutations } from '@apis/match/match-mutations';
-import { userQueries } from '@apis/user/user-queries';
 import Button from '@components/button/button/button';
 import { TAB_TYPES } from '@components/tab/tab/constants/tab-type';
 import { useFunnel } from '@hooks/use-funnel';
 import Complete from '@pages/onboarding/components/complete';
 import CompleteButtonSection from '@pages/onboarding/components/complete-button-section';
-import DateSelect from '@pages/onboarding/components/date-select';
+import DateSelect, { type SelectedGame } from '@pages/onboarding/components/date-select';
 import Frequency from '@pages/onboarding/components/frequency';
 import MatchingType from '@pages/onboarding/components/matching-type';
 import OnboardingHeader from '@pages/onboarding/components/onboarding-header';
@@ -16,7 +15,7 @@ import ViewingStyle from '@pages/onboarding/components/viewing-style';
 import { FIRST_FUNNEL_STEPS, NO_TEAM_OPTION } from '@pages/onboarding/constants/onboarding';
 import { handleButtonClick, isButtonDisabled } from '@pages/onboarding/utils/onboarding-button';
 import { ROUTES } from '@routes/routes-config';
-import { useMutation, useSuspenseQuery } from '@tanstack/react-query';
+import { useMutation } from '@tanstack/react-query';
 import { useState } from 'react';
 import { useNavigate } from 'react-router-dom';
 
@@ -34,8 +33,9 @@ const Onboarding = () => {
     MATCHING_TYPE: null,
   });
 
-  const [createdMatch, setCreatedMatch] = useState<{
-    matchId: number;
+  const [pendingMatch, setPendingMatch] = useState<{
+    game: SelectedGame;
+    date: string;
     type: 'single' | 'group';
   } | null>(null);
 
@@ -44,7 +44,6 @@ const Onboarding = () => {
   };
 
   const navigate = useNavigate();
-
   const { mutate } = useMutation(matchMutations.MATCH_CONDITION());
 
   const handlePrev = () => {
@@ -60,11 +59,8 @@ const Onboarding = () => {
     }
   };
 
-  const { data: user } = useSuspenseQuery(userQueries.USER_INFO());
-  const nickname = user.nickname;
-
   return (
-    <div className="h-full flex-col">
+    <div className="h-full flex-col bg-background">
       <div className="sticky top-0 bg-background">
         <OnboardingHeader onClick={handlePrev} />
         {currentStep !== 'COMPLETE' && (
@@ -104,14 +100,6 @@ const Onboarding = () => {
             />
           </Step>
 
-          {/* TODO: GENDER 단계 관련 전부 삭제 */}
-          {/* <Step name="GENDER">
-            <Gender
-              selectedOption={selections.GENDER}
-              onSelect={(option) => handleSelect('GENDER', option)}
-            />
-          </Step> */}
-
           <Step name="MATCHING_TYPE">
             <MatchingType
               selectedOption={selections.MATCHING_TYPE}
@@ -124,9 +112,10 @@ const Onboarding = () => {
               activeType={
                 selections.MATCHING_TYPE === '1:1 매칭' ? TAB_TYPES.SINGLE : TAB_TYPES.GROUP
               }
-              onComplete={(matchId) => {
-                setCreatedMatch({
-                  matchId,
+              onComplete={({ game, date }) => {
+                setPendingMatch({
+                  game,
+                  date,
                   type: selections.MATCHING_TYPE === '1:1 매칭' ? 'single' : 'group',
                 });
                 goNext();
@@ -135,11 +124,11 @@ const Onboarding = () => {
           </Step>
 
           <Step name="COMPLETE">
-            {createdMatch && (
+            {pendingMatch && (
               <Complete
-                nickname={nickname ?? ''}
-                matchId={createdMatch.matchId}
-                type={createdMatch.type}
+                selectedGame={pendingMatch.game}
+                selectedDate={pendingMatch.date}
+                type={pendingMatch.type}
               />
             )}
           </Step>
@@ -164,7 +153,9 @@ const Onboarding = () => {
             />
           </div>
         )}
-        {currentStep === 'COMPLETE' && <CompleteButtonSection />}
+        {currentStep === 'COMPLETE' && pendingMatch && (
+          <CompleteButtonSection pendingMatch={pendingMatch} />
+        )}
       </div>
     </div>
   );
diff --git a/src/shared/components/bottom-sheet/game-match/game-match-bottom-sheet.tsx b/src/shared/components/bottom-sheet/game-match/game-match-bottom-sheet.tsx
index 7a067d3e..cb91d6aa 100644
--- a/src/shared/components/bottom-sheet/game-match/game-match-bottom-sheet.tsx
+++ b/src/shared/components/bottom-sheet/game-match/game-match-bottom-sheet.tsx
@@ -5,33 +5,22 @@ import GameMatchFooter from '@components/bottom-sheet/game-match/game-match-foot
 import GameMatchList from '@components/bottom-sheet/game-match/game-match-list';
 import { formatDateWeekday } from '@components/bottom-sheet/game-match/utils/format-date-weekday';
 import { TAB_TYPES, type TabType } from '@components/tab/tab/constants/tab-type';
-import { MATCH_REQUEST_ERROR_MESSAGES } from '@constants/error-toast';
 import { gaEvent } from '@libs/analytics';
+import type { SelectedGame } from '@pages/onboarding/components/date-select';
 import { ROUTES } from '@routes/routes-config';
 import { useMutation, useQueryClient } from '@tanstack/react-query';
-import type { AxiosError } from 'axios';
 import { useState } from 'react';
 import { useNavigate } from 'react-router-dom';
-import { showErrorToast } from '@/shared/utils/show-error-toast';
-
-interface GameScheduleItem {
-  id: number;
-  awayTeam: string;
-  homeTeam: string;
-  gameTime: string;
-  stadium: string;
-}
 
 interface GameMatchBottomSheetProps {
   isOpen: boolean;
   onClose: () => void;
   date: string;
-  gameSchedule: GameScheduleItem[];
+  gameSchedule: SelectedGame[];
   onClick?: (selectedId: number | null) => void;
   activeType: TabType;
   fromOnboarding?: boolean;
-  // groupRole?: string | null;  TODO: 추후 삭제
-  onComplete?: (matchId: number) => void;
+  onComplete?: (selected: { game: SelectedGame; date: string }) => void;
 }
 
 const GameMatchBottomSheet = ({
@@ -41,7 +30,6 @@ const GameMatchBottomSheet = ({
   gameSchedule,
   activeType,
   fromOnboarding = false,
-  // groupRole,
   onComplete,
 }: GameMatchBottomSheetProps) => {
   const [selectedIdx, setSelectedIdx] = useState<number | null>(null);
@@ -50,7 +38,7 @@ const GameMatchBottomSheet = ({
   const createMatchMutation = useMutation(matchMutations.CREATE_MATCH());
 
   const disabled = selectedIdx === null || createMatchMutation.isPending;
-  const matchType = activeType === TAB_TYPES.SINGLE ? 'direct' : 'group';
+  const matchType = activeType === TAB_TYPES.SINGLE ? 'DIRECT' : 'GROUP';
   const queryType = activeType === TAB_TYPES.SINGLE ? 'single' : 'group';
 
   const handleClose = () => {
@@ -58,11 +46,21 @@ const GameMatchBottomSheet = ({
     onClose();
   };
 
-  const handleSubmit = async () => {
+  const handleSubmit = () => {
     if (selectedIdx === null) return;
+
     const selectedGame = gameSchedule[selectedIdx];
     if (!selectedGame) return;
 
+    if (fromOnboarding) {
+      handleClose();
+      onComplete?.({
+        game: selectedGame,
+        date,
+      });
+      return;
+    }
+
     const gaMatchType = activeType === TAB_TYPES.SINGLE ? 'one_to_one' : 'group';
     gaEvent('match_create_click', {
       match_type: gaMatchType,
@@ -78,7 +76,7 @@ const GameMatchBottomSheet = ({
         onSuccess: (response) => {
           const createdMatchId = response.matchId.toString();
 
-          if (matchType === 'direct') {
+          if (matchType === 'DIRECT') {
             queryClient.invalidateQueries({
               queryKey: matchQueries.SINGLE_MATCH_LIST(date).queryKey,
             });
@@ -89,21 +87,7 @@ const GameMatchBottomSheet = ({
           }
 
           handleClose();
-
-          if (fromOnboarding) {
-            onComplete?.(response.matchId);
-          } else {
-            navigate(`${ROUTES.MATCH_CREATE(createdMatchId.toString())}?type=${queryType}`);
-          }
-        },
-        onError: (error) => {
-          const status = (error as AxiosError)?.response?.status;
-
-          if (status === MATCH_REQUEST_ERROR_MESSAGES.TOO_MANY_REQUESTS.status) {
-            showErrorToast(MATCH_REQUEST_ERROR_MESSAGES.TOO_MANY_REQUESTS.message, '8.3rem');
-          } else if (status === MATCH_REQUEST_ERROR_MESSAGES.DUPLICATE_MATCH.status) {
-            showErrorToast(MATCH_REQUEST_ERROR_MESSAGES.DUPLICATE_MATCH.message, '8.3rem');
-          }
+          navigate(`${ROUTES.MATCH_CREATE(createdMatchId)}?type=${queryType}`);
         },
       },
     );
diff --git a/src/shared/constants/error-toast.ts b/src/shared/constants/error-toast.ts
index 48906d1b..d3bf9a8a 100644
--- a/src/shared/constants/error-toast.ts
+++ b/src/shared/constants/error-toast.ts
@@ -21,3 +21,5 @@ export const NO_GAME_TOAST_MESSAGE = '해당 날짜에는 진행되는 경기가
 export const HAS_DONE_TOAST_MESSAGE = '이미 매칭을 만든 경기예요.';
 
 export const MY_MATCH_TOAST_MESSAGE = '내가 만든 매칭은 매칭현황에서 확인 가능해요.';
+
+export const CREATE_MATCH_TOAST_MESSAGE = '방금 만든 카드를 매칭 현황에서 확인해 보세요!  🎉 ';
diff --git a/src/shared/styles/global.css b/src/shared/styles/global.css
index 6959a2bb..fa10790e 100644
--- a/src/shared/styles/global.css
+++ b/src/shared/styles/global.css
@@ -46,4 +46,8 @@
   body::-webkit-scrollbar {
     display: none; /* Chrome, Safari */
   }
+
+  .toast-text {
+    max-width: none !important;
+  }
 }
diff --git a/src/shared/utils/show-error-toast.tsx b/src/shared/utils/show-error-toast.tsx
index 1dc99aae..f1a6d738 100644
--- a/src/shared/utils/show-error-toast.tsx
+++ b/src/shared/utils/show-error-toast.tsx
@@ -4,12 +4,13 @@ import { toast } from 'react-compact-toast';
 type ShowErrorToastOptions = {
   icon?: boolean;
   offset?: string;
+  className?: string;
 };
 
 const DEFAULT_AUTOCLOSE = 2000;
 
 const showErrorToastCore = (message: string, opts?: ShowErrorToastOptions) => {
-  const { icon = true } = opts ?? {};
+  const { icon = true, className = '' } = opts ?? {};
 
   toast({
     text: message,
@@ -17,8 +18,13 @@ const showErrorToastCore = (message: string, opts?: ShowErrorToastOptions) => {
     autoClose: DEFAULT_AUTOCLOSE,
     offset: opts?.offset,
     position: 'bottomCenter',
-    className:
-      '!min-h-[4.5rem] max-w-[calc(43rem-3.2rem)] w-[calc(100%-3.2rem)] cap_14_m text-gray-white rounded-[12px] bg-gray-700',
+    className: `
+      !min-h-[4.5rem]
+      max-w-[calc(43rem-3.2rem)]
+      w-[calc(100%-3.2rem)]
+      rounded-[12px]
+      ${className || 'cap_14_m text-gray-white bg-gray-700'}
+    `,
   });
 };