diff --git a/.github/pull_request_template.md b/.github/pull_request_template.md
new file mode 100644
index 00000000..2536746a
--- /dev/null
+++ b/.github/pull_request_template.md
@@ -0,0 +1,15 @@
+# 요약 \*
+
+<!-- 닫는 이슈 번호 및 PR 내용에 대한 간단한 요약 표기. -->
+
+It closes #issue_number
+
+# 스크린샷
+
+<!-- PR 변경 사항에 대한 스크린샷이나 .gif 파일 -->
+
+# 이후 Task \*
+
+<!-- PR 이후 개설할 이슈 목록 -->
+
+- 없음
diff --git a/docker-compose.yml b/docker-compose.yml
index a3f89387..32f0e0ce 100644
--- a/docker-compose.yml
+++ b/docker-compose.yml
@@ -1,4 +1,4 @@
-version: "3.4"
+version: "3.9"
 name: "biseo"
 
 services:
@@ -28,7 +28,8 @@ services:
       context: .
       dockerfile: .docker/api.Dockerfile
     depends_on:
-      - db
+      db:
+        condition: service_healthy
     networks:
       - frontend
       - backend
@@ -44,6 +45,11 @@ services:
     command: --character-set-server=utf8mb4 --collation-server=utf8mb4_unicode_ci
     networks:
       - backend
+    healthcheck:
+      test: "mysql -uroot -p$$MYSQL_ROOT_PASSWORD $$MYSQL_DATABASE -e 'select 1'"
+      start_period: 0s
+      interval: 1s
+      retries: 3
 
 volumes:
   biseo-data:
diff --git a/packages/api/docker-compose.dev.yml b/packages/api/docker-compose.dev.yml
index e7558a9c..a9361e0b 100644
--- a/packages/api/docker-compose.dev.yml
+++ b/packages/api/docker-compose.dev.yml
@@ -12,6 +12,11 @@ services:
     volumes:
       - db:/var/lib/mysql
     command: --character-set-server=utf8mb4 --collation-server=utf8mb4_unicode_ci
+    healthcheck:
+      test: "mysql -uroot -p$$MYSQL_ROOT_PASSWORD $$MYSQL_DATABASE -e 'select 1'"
+      start_period: 0s
+      interval: 1s
+      retries: 30
 
 volumes:
   db:
diff --git a/packages/api/package.json b/packages/api/package.json
index 08f23349..782704f4 100644
--- a/packages/api/package.json
+++ b/packages/api/package.json
@@ -4,13 +4,13 @@
   "main": "src/index.ts",
   "license": "MIT",
   "scripts": {
-    "dev": "pnpm migrate && nodemon",
+    "dev": "pnpm migrate:dev && nodemon",
     "prod": "prisma migrate deploy && node dist/index.js",
     "db": "docker compose -f docker-compose.dev.yml",
     "typecheck": "prisma generate && tsc --noEmit",
     "typegen": "prisma generate",
-    "migrate": "pnpm db up -d && prisma migrate dev",
-    "studio": "pnpm db up -d && prisma studio",
+    "migrate:dev": "pnpm db up --wait && prisma migrate dev",
+    "studio": "pnpm db up --wait && prisma studio",
     "build": "prisma generate && tsc -p tsconfig.build.json && tsc-alias -p tsconfig.build.json",
     "env": "echo $NODE_ENV"
   },
diff --git a/packages/api/src/lib/error.ts b/packages/api/src/lib/error.ts
index 39d7317a..bbbc0fee 100644
--- a/packages/api/src/lib/error.ts
+++ b/packages/api/src/lib/error.ts
@@ -2,6 +2,11 @@ import type { Error as ErrorResponse } from "@biseo/interface/helpers";
 import logger from "@biseo/api/utils/logger";
 
 export class BiseoError extends Error {
+  constructor(message: string) {
+    super(message);
+    Object.setPrototypeOf(this, BiseoError.prototype);
+  }
+
   serialize() {
     return { ok: false, message: this.message } as const;
   }
diff --git a/packages/web/src/components/atoms/Button.tsx b/packages/web/src/components/atoms/Button.tsx
index 3d478861..c48b4cbb 100644
--- a/packages/web/src/components/atoms/Button.tsx
+++ b/packages/web/src/components/atoms/Button.tsx
@@ -33,6 +33,7 @@ export const Button = styled.button<{
 
     &:disabled {
       cursor: not-allowed;
+      background-color: ${theme.colors.gray100};
     }
   `,
 );
diff --git a/packages/web/src/components/atoms/Card.tsx b/packages/web/src/components/atoms/Card.tsx
index 01ffb38b..5b93c53d 100644
--- a/packages/web/src/components/atoms/Card.tsx
+++ b/packages/web/src/components/atoms/Card.tsx
@@ -25,7 +25,7 @@ export const Card = styled.div<{
     background-color: ${primary ? theme.colors.blue100 : theme.colors.white};
     border: 1px solid
       ${(() => {
-        if (bold) return primary ? theme.colors.blue600 : theme.colors.gray500;
+        if (bold) return primary ? theme.colors.blue600 : theme.colors.gray400;
         return primary ? theme.colors.blue300 : theme.colors.gray300;
       })()};
     padding: ${small ? `12px 15px` : `18px 20px`};
diff --git a/packages/web/src/components/atoms/Label.tsx b/packages/web/src/components/atoms/Label.tsx
index c800b542..f3ab9019 100644
--- a/packages/web/src/components/atoms/Label.tsx
+++ b/packages/web/src/components/atoms/Label.tsx
@@ -17,7 +17,7 @@ export const Select = styled.select<{ w: number; h: number }>`
   border: 1px solid ${props => props.theme.colors.gray200};
   background-color: ${props => props.theme.colors.white};
 
-  font-family: "Noto Sansf KR";
+  font-family: "Noto Sans KR";
   font-size: 10px;
   font-style: normal;
   font-weight: 500;
diff --git a/packages/web/src/components/atoms/SelectBox.tsx b/packages/web/src/components/atoms/SelectBox.tsx
index 4af10efc..3d8cd81f 100644
--- a/packages/web/src/components/atoms/SelectBox.tsx
+++ b/packages/web/src/components/atoms/SelectBox.tsx
@@ -21,7 +21,7 @@ export const SelectBox: React.FC<SelectBoxProps> = ({
       onChange={e => onChange(e.target.value)}
       defaultValue=""
     >
-      <option value="">전체보기</option>
+      <option value="">전체 보기</option>
       {options.map(option => (
         <option key={option} value={option}>
           {option}
diff --git a/packages/web/src/components/atoms/placeholder.css b/packages/web/src/components/atoms/placeholder.css
index 165dbff5..bc15a508 100644
--- a/packages/web/src/components/atoms/placeholder.css
+++ b/packages/web/src/components/atoms/placeholder.css
@@ -1,7 +1,7 @@
 ::placeholder {
   color: #d9d9d9;
 
-  font-family: "Noto Sansf KR";
+  font-family: "Noto Sans KR";
   font-size: 11px;
   font-style: normal;
   font-weight: 500;
diff --git a/packages/web/src/components/molecules/AgendaCard/TerminatedAgendaCard.tsx b/packages/web/src/components/molecules/AgendaCard/TerminatedAgendaCard.tsx
index 812280cc..c3593c24 100644
--- a/packages/web/src/components/molecules/AgendaCard/TerminatedAgendaCard.tsx
+++ b/packages/web/src/components/molecules/AgendaCard/TerminatedAgendaCard.tsx
@@ -60,7 +60,7 @@ export const TerminatedAgendaCard: React.FC<Props> = ({ agenda }) => {
             revealChoice={revealChoice}
             voted={agenda.user.voted != null}
           />
-          <div css={[column, gap(12), w("fill")]}>
+          <div css={[column, gap(6), w("fill")]}>
             {agenda.choices.map(choice => (
               <OptionVoteResult
                 name={choice.name}
diff --git a/packages/web/src/components/molecules/Choice.tsx b/packages/web/src/components/molecules/Choice.tsx
index 5f263da4..d2a2dd80 100644
--- a/packages/web/src/components/molecules/Choice.tsx
+++ b/packages/web/src/components/molecules/Choice.tsx
@@ -6,6 +6,7 @@ import type { Choice } from "@biseo/interface/agenda";
 import { Text } from "@biseo/web/components/atoms";
 import { SelectIcon } from "@biseo/web/assets";
 import { type Color, theme } from "@biseo/web/theme";
+import { center, h, w } from "@biseo/web/styles";
 
 const Container = styled.div<{
   color: Color;
@@ -14,9 +15,9 @@ const Container = styled.div<{
   border-radius: 5px;
   background-color: ${props => props.theme.colors[props.color]};
   border: 1px solid ${props => props.theme.colors.gray200};
-  padding: 6px 13px 6px 13px;
+  padding: 6px 12px 6px 12px;
   width: 340px;
-  height: 30px;
+  height: fit-content;
   gap: 10px;
   display: flex;
   flex-direction: row;
@@ -34,7 +35,14 @@ interface ChoiceTextProps extends PropsWithChildren {
 }
 
 const ChoiceText: React.FC<ChoiceTextProps> = ({ color, children = null }) => (
-  <Text variant="body" color={color}>
+  <Text
+    variant="body"
+    color={color}
+    style={{
+      wordBreak: "break-all",
+      overflowWrap: "break-word",
+    }}
+  >
     {children}
   </Text>
 );
@@ -76,7 +84,9 @@ const ChoiceBase: React.FC<ChoiceBaseProps> = ({
       onMouseEnter={onMouseEnter}
       onMouseLeave={onMouseLeave}
     >
-      <SelectIcon stroke={theme.colors[choiceStyle.selectIconColor]} />
+      <div css={[w(13), h(13), center]}>
+        <SelectIcon stroke={theme.colors[choiceStyle.selectIconColor]} />
+      </div>
       <ChoiceText color={choiceStyle.textColor}>{text}</ChoiceText>
     </Container>
   );
diff --git a/packages/web/src/components/molecules/ModalInnerTextBox.tsx b/packages/web/src/components/molecules/ModalInnerTextBox.tsx
index 2fa3b8e7..ea4e2b41 100644
--- a/packages/web/src/components/molecules/ModalInnerTextBox.tsx
+++ b/packages/web/src/components/molecules/ModalInnerTextBox.tsx
@@ -13,6 +13,8 @@ import {
 } from "@biseo/web/components/atoms";
 import "@biseo/web/components/atoms/placeholder.css";
 import { TrashIcon } from "@biseo/web/assets";
+import { css } from "@emotion/react";
+import { scroll, scrollBar } from "@biseo/web/styles";
 
 interface ModalInnerProps extends PropsWithChildren {
   title: string;
@@ -52,6 +54,9 @@ interface SubComponents {
   TaggerBox: typeof TaggerBox;
 }
 
+/** @constant 클라이언트와 서버에서 사용하는 채팅 메시지의 최대 길이를 지정합니다. */
+const maxTextLength = 255;
+
 export const ModalInner: React.FC<ModalInnerProps> & SubComponents = ({
   title,
   count = undefined,
@@ -143,6 +148,7 @@ const InputBox: React.FC<InputProps> = ({ value = undefined, onChange }) => (
       placeholder="내용을 입력하세요"
       value={value}
       onChange={onChange}
+      maxLength={maxTextLength}
     />
   </BorderedBox>
 );
@@ -165,6 +171,7 @@ const TextAreaInputBox: React.FC<TextAreaProps> = ({
       placeholder="내용을 입력하세요"
       value={value}
       onChange={onChange}
+      maxLength={maxTextLength}
     />
   </BorderedBox>
 );
@@ -209,11 +216,26 @@ const TextButton: React.FC<SubmitProps> = ({
 );
 ModalInner.TextButton = TextButton;
 
-const VoteOptions: React.FC<PropsWithChildren> = ({ children = null }) => (
-  <Box dir="row" gap={8}>
-    {children}
-  </Box>
-);
+const VoteOptions: React.FC<PropsWithChildren> = ({ children = null }) => {
+  const scrollTyle = css`
+    ${scroll.y}
+    ${scrollBar}
+  overflow-y: scroll;
+  `;
+  return (
+    <Box
+      dir="row"
+      gap={8}
+      w="fill"
+      h={150}
+      wrap="wrap"
+      justify="flex-start"
+      css={scrollTyle}
+    >
+      {children}
+    </Box>
+  );
+};
 ModalInner.VoteOptions = VoteOptions;
 
 const VoteOption: React.FC<PropsWithChildren> = ({ children = null }) => (
@@ -221,12 +243,18 @@ const VoteOption: React.FC<PropsWithChildren> = ({ children = null }) => (
     borderColor="gray200"
     bg="white"
     w="hug"
-    h={30}
+    h="hug"
     justify="center"
     borderSize={1}
+    padVertical={7}
     padHorizontal={15}
     round={5}
     borderStyle="solid"
+    style={{
+      maxWidth: "100%",
+      wordBreak: "break-all",
+      overflowWrap: "break-word",
+    }}
   >
     <Text color="gray600" variant="subtitle">
       {children}
@@ -276,22 +304,32 @@ const VoteChoice: React.FC<PropsWithChildren & { onClick?: () => void }> = ({
     borderColor="gray200"
     bg="white"
     w="fill"
-    h={32}
+    h="hug"
     borderSize={1}
-    padVertical={6}
-    padLeft={12}
-    padRight={0}
+    padVertical={8}
+    padHorizontal={12}
     round={5}
     borderStyle="solid"
     justify="space-between"
+    gap={5}
     dir="row"
-    align="center"
+    align="flex-start"
+    style={{
+      minHeight: 32,
+    }}
   >
-    <Text color="gray500" variant="subtitle">
+    <Text
+      color="gray500"
+      variant="subtitle"
+      style={{
+        wordBreak: "break-all",
+        overflowWrap: "break-word",
+      }}
+    >
       {children}
     </Text>
     <Clickable>
-      <Box pad={10} onClick={onClick}>
+      <Box w={13} h={13} justify="center" align="center" onClick={onClick}>
         <TrashIcon />
       </Box>
     </Clickable>
diff --git a/packages/web/src/components/molecules/OptionVoteResult.tsx b/packages/web/src/components/molecules/OptionVoteResult.tsx
index bf77f89b..36b6cfca 100644
--- a/packages/web/src/components/molecules/OptionVoteResult.tsx
+++ b/packages/web/src/components/molecules/OptionVoteResult.tsx
@@ -37,7 +37,7 @@ export const OptionVoteResult: React.FC<Props> = ({
   <Box w="fill" h={30}>
     <Background
       percent={(count / totalCount) * 100}
-      color={userChoice ? "blue200" : "blue100"}
+      color={userChoice ? "blue300" : "blue200"}
       borderColor={userChoice ? "blue300" : "gray200"}
     >
       <Box
diff --git a/packages/web/src/components/molecules/Profile.tsx b/packages/web/src/components/molecules/Profile.tsx
new file mode 100644
index 00000000..757b3bdf
--- /dev/null
+++ b/packages/web/src/components/molecules/Profile.tsx
@@ -0,0 +1,60 @@
+import React from "react";
+import { Button, Divider } from "@biseo/web/components/atoms";
+import {
+  text,
+  align,
+  border,
+  column,
+  round,
+  w,
+  h,
+  bg,
+  gap,
+  padding,
+  justify,
+} from "@biseo/web/styles";
+
+type Props = {
+  displayName: string;
+  onLogout: () => void;
+};
+
+export const Profile: React.FC<Props> = ({ displayName, onLogout }) => (
+  <div
+    css={[align.center, { position: "absolute", right: "0px", zIndex: 1000 }]}
+  >
+    <div css={[h(5)]} />
+    <div
+      css={[
+        border.gray200,
+        round.md,
+        w(100),
+        column,
+        align.center,
+        gap(4),
+        padding.vertical(5),
+        bg.white,
+        "box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.06)",
+      ]}
+    >
+      <div
+        css={[
+          round.md,
+          w(100),
+          h(18),
+          padding.horizontal(8),
+          justify.between,
+          align.center,
+        ]}
+      >
+        <div css={[text.option2, text.gray600, "text-align: center"]}>
+          {displayName}
+        </div>
+      </div>
+      <Divider />
+      <Button w={90} h={20} padHorizontal={8} onClick={onLogout}>
+        <div css={[text.option2, text.blue600]}>로그아웃</div>
+      </Button>
+    </div>
+  </div>
+);
diff --git a/packages/web/src/components/molecules/UserTagCards.tsx b/packages/web/src/components/molecules/UserTagCards.tsx
index 42012c03..0d4f6693 100644
--- a/packages/web/src/components/molecules/UserTagCards.tsx
+++ b/packages/web/src/components/molecules/UserTagCards.tsx
@@ -18,7 +18,7 @@ export const UserTagCards: React.FC<Props> = ({ tag }) => {
   const navigate = useNavigate();
   const openModal = () => navigate(`tagEdit?tagId=${tag.id}`);
   return (
-    <Card primary={false} round={5} onClick={openModal}>
+    <Card primary={false} round={5} onClick={openModal} clickable>
       <Box gap={8}>
         <Box gap={8} dir="row">
           <AdminTag tags={adminTags} suffix={tag.users.length} />
diff --git a/packages/web/src/components/molecules/VoteParticipate.tsx b/packages/web/src/components/molecules/VoteParticipate.tsx
index 2e139a8e..198c3de3 100644
--- a/packages/web/src/components/molecules/VoteParticipate.tsx
+++ b/packages/web/src/components/molecules/VoteParticipate.tsx
@@ -11,7 +11,7 @@ export const VoteParticipate: React.FC<Props> = ({ voted, total }) => {
   const participantInfo = useMemo(
     () =>
       hover
-        ? `투표 참여자 ${voted}명 /투표 대상자 ${total}명`
+        ? `투표 참여자 ${voted}명 / 투표 대상자 ${total}명`
         : `${voted}/${total}`,
     [hover],
   );
diff --git a/packages/web/src/components/molecules/VoteResult.tsx b/packages/web/src/components/molecules/VoteResult.tsx
index 19b77e4a..fe1c8b2b 100644
--- a/packages/web/src/components/molecules/VoteResult.tsx
+++ b/packages/web/src/components/molecules/VoteResult.tsx
@@ -22,7 +22,7 @@ export const VoteResult: React.FC<Props> = ({
       {voted ? (
         <Text
           variant="option2"
-          color="gray500"
+          color="gray400"
           onClick={e => {
             clickHandler(revealChoice);
             e.stopPropagation();
diff --git a/packages/web/src/components/molecules/index.ts b/packages/web/src/components/molecules/index.ts
index 76798641..95ff307d 100644
--- a/packages/web/src/components/molecules/index.ts
+++ b/packages/web/src/components/molecules/index.ts
@@ -21,3 +21,4 @@ export * from "./AdminTag";
 export * from "./AddButtonCard";
 export * from "./AgendaCard";
 export * from "./VoteParticipate";
+export * from "./Profile";
diff --git a/packages/web/src/components/organisms/AdminAgendaSection.tsx b/packages/web/src/components/organisms/AdminAgendaSection.tsx
index 286a8e99..a5d984c9 100644
--- a/packages/web/src/components/organisms/AdminAgendaSection.tsx
+++ b/packages/web/src/components/organisms/AdminAgendaSection.tsx
@@ -68,7 +68,7 @@ export const AdminAgendaSection: React.FC = () => {
       </Box>
       <Box dir="column" w={300}>
         <SectionHeader count={ongoingAgendas.length}>
-          진행중인 투표
+          진행 중인 투표
         </SectionHeader>
         {getAgendaCards("ongoing")}
       </Box>
diff --git a/packages/web/src/components/organisms/CreateAgendaModal.tsx b/packages/web/src/components/organisms/CreateAgendaModal.tsx
index 978170dc..daedf644 100644
--- a/packages/web/src/components/organisms/CreateAgendaModal.tsx
+++ b/packages/web/src/components/organisms/CreateAgendaModal.tsx
@@ -199,7 +199,10 @@ export const CreateAgendaModal: React.FC = () => {
               style={{ textDecoration: "none" }}
             >
               <Button w={270} h={38} onClick={onSubmit} disabled={!validated}>
-                <Text variant="boldtitle3" color="blue600">
+                <Text
+                  variant="boldtitle3"
+                  color={validated ? "blue600" : "gray300"}
+                >
                   투표 생성하기
                 </Text>
               </Button>
diff --git a/packages/web/src/components/organisms/CreateUserTagModal.tsx b/packages/web/src/components/organisms/CreateUserTagModal.tsx
index b73d5042..9c39de8d 100644
--- a/packages/web/src/components/organisms/CreateUserTagModal.tsx
+++ b/packages/web/src/components/organisms/CreateUserTagModal.tsx
@@ -22,7 +22,7 @@ export const CreateUserTagModal: React.FC = () => {
   const onChangeTitle = (e: React.ChangeEvent<HTMLInputElement>) => {
     setTitle(e.target.value);
   };
-  const onChangeDescription = (e: React.ChangeEvent<HTMLInputElement>) => {
+  const onChangeDescription = (e: React.ChangeEvent<HTMLTextAreaElement>) => {
     setDescription(e.target.value);
   };
 
@@ -58,7 +58,7 @@ export const CreateUserTagModal: React.FC = () => {
           </ModalInner>
 
           <ModalInner title="태그 설명" required>
-            <ModalInner.InputBox
+            <ModalInner.TextAreaInputBox
               onChange={onChangeDescription}
               value={description}
             />
@@ -83,7 +83,10 @@ export const CreateUserTagModal: React.FC = () => {
               style={{ textDecoration: "none" }}
             >
               <Button w={300} h={42} onClick={onSubmit} disabled={!validated}>
-                <Text variant="boldtitle3" color="blue600">
+                <Text
+                  variant="boldtitle3"
+                  color={validated ? "blue600" : "gray300"}
+                >
                   태그 생성하기
                 </Text>
               </Button>
diff --git a/packages/web/src/components/organisms/EditAgendaModal.tsx b/packages/web/src/components/organisms/EditAgendaModal.tsx
index 35b19154..40005d63 100644
--- a/packages/web/src/components/organisms/EditAgendaModal.tsx
+++ b/packages/web/src/components/organisms/EditAgendaModal.tsx
@@ -53,7 +53,7 @@ export const EditAgendaModal: React.FC = () => {
   const onChangeTitle = (e: React.ChangeEvent<HTMLInputElement>) => {
     setTitle(e.target.value);
   };
-  const onChangeContent = (e: React.ChangeEvent<HTMLInputElement>) => {
+  const onChangeContent = (e: React.ChangeEvent<HTMLTextAreaElement>) => {
     setContent(e.target.value);
   };
   const onChangeResolution = (e: React.ChangeEvent<HTMLInputElement>) => {
@@ -150,7 +150,10 @@ export const EditAgendaModal: React.FC = () => {
               <ModalInner.InputBox value={title} onChange={onChangeTitle} />
             </ModalInner>
             <ModalInner title="투표 설명" required>
-              <ModalInner.InputBox value={content} onChange={onChangeContent} />
+              <ModalInner.TextAreaInputBox
+                value={content}
+                onChange={onChangeContent}
+              />
             </ModalInner>
             <ModalInner title="의결 문안" required>
               <ModalInner.InputBox
diff --git a/packages/web/src/components/organisms/EditTemplateModal.tsx b/packages/web/src/components/organisms/EditTemplateModal.tsx
index 23a123e7..1d87558f 100644
--- a/packages/web/src/components/organisms/EditTemplateModal.tsx
+++ b/packages/web/src/components/organisms/EditTemplateModal.tsx
@@ -42,7 +42,7 @@ export const EditTemplateModal: React.FC = () => {
   const onChangeAgendaTitle = (e: React.ChangeEvent<HTMLInputElement>) => {
     setAgendaTitle(e.target.value);
   };
-  const onChangeAgendaContent = (e: React.ChangeEvent<HTMLInputElement>) => {
+  const onChangeAgendaContent = (e: React.ChangeEvent<HTMLTextAreaElement>) => {
     setAgendaContent(e.target.value);
   };
   const onChangeAgendaResolution = (e: React.ChangeEvent<HTMLInputElement>) => {
@@ -113,7 +113,7 @@ export const EditTemplateModal: React.FC = () => {
           </ModalInner>
 
           <ModalInner title="투표 설명" required>
-            <ModalInner.InputBox
+            <ModalInner.TextAreaInputBox
               onChange={onChangeAgendaContent}
               value={agendaContent}
             />
diff --git a/packages/web/src/components/organisms/EditUserTagModal.tsx b/packages/web/src/components/organisms/EditUserTagModal.tsx
index d18e48e9..3f8a2f57 100644
--- a/packages/web/src/components/organisms/EditUserTagModal.tsx
+++ b/packages/web/src/components/organisms/EditUserTagModal.tsx
@@ -31,7 +31,7 @@ export const EditUserTagModal: React.FC = () => {
   const onChangeTitle = (e: React.ChangeEvent<HTMLInputElement>) => {
     setTitle(e.target.value);
   };
-  const onChangeDescription = (e: React.ChangeEvent<HTMLInputElement>) => {
+  const onChangeDescription = (e: React.ChangeEvent<HTMLTextAreaElement>) => {
     setDescription(e.target.value);
   };
 
@@ -68,7 +68,7 @@ export const EditUserTagModal: React.FC = () => {
           </ModalInner>
 
           <ModalInner title="태그 설명" required>
-            <ModalInner.InputBox
+            <ModalInner.TextAreaInputBox
               value={description}
               onChange={onChangeDescription}
             />
diff --git a/packages/web/src/components/organisms/Header.tsx b/packages/web/src/components/organisms/Header.tsx
index 939881f2..2c995a64 100644
--- a/packages/web/src/components/organisms/Header.tsx
+++ b/packages/web/src/components/organisms/Header.tsx
@@ -1,10 +1,11 @@
-import React from "react";
+import React, { useState } from "react";
 import styled from "@emotion/styled";
 import { useNavigate } from "react-router-dom";
 import { LogoIcon } from "@biseo/web/assets";
-import { Box, Button, Text } from "@biseo/web/components/atoms";
-import { HeaderItem } from "@biseo/web/components/molecules";
+import { Box } from "@biseo/web/components/atoms";
+import { HeaderItem, Profile } from "@biseo/web/components/molecules";
 import { useAuth } from "@biseo/web/services/auth";
+import { bg, center, h, w, round, text } from "@biseo/web/styles";
 
 const adminPathList = [
   { name: "유저 모드", path: "" },
@@ -36,7 +37,7 @@ export const Header: React.FC = () => {
     logout();
     navigate("/", { replace: true });
   };
-
+  const [hover, setHover] = useState(false);
   return (
     <Container>
       <Box h="fill" dir="row" align="center">
@@ -58,13 +59,25 @@ export const Header: React.FC = () => {
             ))
           : null}
       </Box>
-      <Button h={28} w={28} onClick={handleLogout}>
-        <Text variant="boldtitle3" color="blue600">
-          {displayName === undefined
-            ? "?"
-            : displayName.slice(0, 1).toUpperCase()}
-        </Text>
-      </Button>
+      <div
+        css={[{ position: "relative" }]}
+        onMouseEnter={() => setHover(true)}
+        onMouseLeave={() => setHover(false)}
+      >
+        <div css={[h(28), w(28), bg.blue200, round.md, center]}>
+          <div css={[text.boldtitle3, text.blue600]}>
+            {displayName === undefined
+              ? "?"
+              : displayName.slice(0, 1).toUpperCase()}
+          </div>
+        </div>
+        {hover ? (
+          <Profile
+            displayName={displayName === undefined ? "?" : displayName}
+            onLogout={handleLogout}
+          />
+        ) : null}
+      </div>
     </Container>
   );
 };
diff --git a/packages/web/src/constants/phrases.ts b/packages/web/src/constants/phrases.ts
index 8ba914b9..04d8b231 100644
--- a/packages/web/src/constants/phrases.ts
+++ b/packages/web/src/constants/phrases.ts
@@ -2,6 +2,6 @@ import type { AgendaStatus } from "@biseo/interface/agenda";
 
 export const agendaStatusNames: Record<AgendaStatus, string> = {
   preparing: "예정된 투표",
-  ongoing: "진행중인 투표",
+  ongoing: "진행 중인 투표",
   terminated: "종료된 투표",
 } as const;