diff --git a/example/src/App.tsx b/example/src/App.tsx
index c2ab602eb..6e9482ec3 100644
--- a/example/src/App.tsx
+++ b/example/src/App.tsx
@@ -78,6 +78,7 @@ const App = () => {
       <Gantt
         tasks={tasks}
         viewMode={view}
+        locale="kor"
         onDateChange={handleTaskChange}
         onDelete={handleTaskDelete}
         onProgressChange={handleProgressChange}
@@ -92,6 +93,7 @@ const App = () => {
       <Gantt
         tasks={tasks}
         viewMode={view}
+        locale="kor"
         onDateChange={handleTaskChange}
         onDelete={handleTaskDelete}
         onProgressChange={handleProgressChange}
diff --git a/src/components/calendar/calendar.tsx b/src/components/calendar/calendar.tsx
index c2eac9cf5..f77c494cf 100644
--- a/src/components/calendar/calendar.tsx
+++ b/src/components/calendar/calendar.tsx
@@ -6,7 +6,7 @@ import {
   getDaysInMonth,
   getLocalDayOfWeek,
   getLocaleMonth,
-  getWeekNumberISO8601,
+  getWeekOfMonth,
 } from "../../helpers/date-helper";
 import { DateSetup } from "../../types/date-setup";
 import styles from "./calendar.module.css";
@@ -40,14 +40,24 @@ export const Calendar: React.FC<CalendarProps> = ({
       const date = dateSetup.dates[i];
       const bottomValue = date.getFullYear();
       bottomValues.push(
-        <text
-          key={date.getTime()}
-          y={headerHeight * 0.8}
-          x={columnWidth * i + columnWidth * 0.5}
-          className={styles.calendarBottomText}
-        >
-          {bottomValue}
-        </text>
+        <g key={date.getTime()}>
+          <line
+            x1={columnWidth * i}
+            y1={headerHeight * 0.6}
+            x2={columnWidth * i}
+            y2={headerHeight}
+            style={{ stroke: "black", strokeWidth: 1 }}
+          />
+          <text
+            y={headerHeight * 0.8}
+            x={columnWidth * i + columnWidth * 0.5}
+            textAnchor="middle"
+            alignmentBaseline="middle"
+            className={styles.calendarBottomText}
+          >
+            {bottomValue}
+          </text>
+        </g>
       );
       if (
         i === 0 ||
@@ -129,14 +139,24 @@ export const Calendar: React.FC<CalendarProps> = ({
       const date = dateSetup.dates[i];
       const bottomValue = getLocaleMonth(date, locale);
       bottomValues.push(
-        <text
-          key={bottomValue + date.getFullYear()}
-          y={headerHeight * 0.8}
-          x={columnWidth * i + columnWidth * 0.5}
-          className={styles.calendarBottomText}
-        >
-          {bottomValue}
-        </text>
+        <g key={date.getTime()}>
+          <line
+            x1={columnWidth * i}
+            y1={headerHeight * 0.6}
+            x2={columnWidth * i}
+            y2={headerHeight}
+            style={{ stroke: "black", strokeWidth: 1 }}
+          />
+          <text
+            y={headerHeight * 0.8}
+            x={columnWidth * i + columnWidth * 0.5}
+            textAnchor="middle"
+            alignmentBaseline="middle"
+            className={styles.calendarBottomText}
+          >
+            {bottomValue}
+          </text>
+        </g>
       );
       if (
         i === 0 ||
@@ -176,20 +196,37 @@ export const Calendar: React.FC<CalendarProps> = ({
       let topValue = "";
       if (i === 0 || date.getMonth() !== dates[i - 1].getMonth()) {
         // top
-        topValue = `${getLocaleMonth(date, locale)}, ${date.getFullYear()}`;
+        if (locale === "kor") {
+          topValue = `${date.getFullYear()}년 ${getLocaleMonth(date, locale)}`;
+        } else {
+          topValue = `${getLocaleMonth(date, locale)}, ${date.getFullYear()}`;
+        }
       }
       // bottom
-      const bottomValue = `W${getWeekNumberISO8601(date)}`;
+      const bottomValue =
+        locale === "kor"
+          ? `${getLocaleMonth(date, locale)} ${getWeekOfMonth(date)}주`
+          : `W${getWeekOfMonth(date)}`;
 
       bottomValues.push(
-        <text
-          key={date.getTime()}
-          y={headerHeight * 0.8}
-          x={columnWidth * (i + +rtl)}
-          className={styles.calendarBottomText}
-        >
-          {bottomValue}
-        </text>
+        <g key={date.getTime()}>
+          <line
+            x1={columnWidth * i}
+            y1={headerHeight * 0.6}
+            x2={columnWidth * i}
+            y2={headerHeight}
+            style={{ stroke: "black", strokeWidth: 1 }}
+          />
+          <text
+            y={headerHeight * 0.8}
+            x={columnWidth * i + columnWidth * 0.5}
+            textAnchor="middle"
+            alignmentBaseline="middle"
+            className={styles.calendarBottomText}
+          >
+            {bottomValue}
+          </text>
+        </g>
       );
 
       if (topValue) {
@@ -221,19 +258,39 @@ export const Calendar: React.FC<CalendarProps> = ({
     const dates = dateSetup.dates;
     for (let i = 0; i < dates.length; i++) {
       const date = dates[i];
-      const bottomValue = `${getLocalDayOfWeek(date, locale, "short")}, ${date
-        .getDate()
-        .toString()}`;
+      const bottomValue =
+        locale === "kor"
+          ? `${getLocaleMonth(
+              date,
+              locale
+            )} ${date.getDate()}일 (${getLocalDayOfWeek(
+              date,
+              locale,
+              "short"
+            )})`
+          : `${getLocalDayOfWeek(date, locale, "short")}, ${date
+              .getDate()
+              .toString()}`;
 
       bottomValues.push(
-        <text
-          key={date.getTime()}
-          y={headerHeight * 0.8}
-          x={columnWidth * i + columnWidth * 0.5}
-          className={styles.calendarBottomText}
-        >
-          {bottomValue}
-        </text>
+        <g key={date.getTime()}>
+          <line
+            x1={columnWidth * i}
+            y1={headerHeight * 0.6}
+            x2={columnWidth * i}
+            y2={headerHeight}
+            style={{ stroke: "black", strokeWidth: 1 }}
+          />
+          <text
+            y={headerHeight * 0.8}
+            x={columnWidth * i + columnWidth * 0.5}
+            textAnchor="middle"
+            alignmentBaseline="middle"
+            className={styles.calendarBottomText}
+          >
+            {bottomValue}
+          </text>
+        </g>
       );
       if (
         i + 1 !== dates.length &&
@@ -275,22 +332,41 @@ export const Calendar: React.FC<CalendarProps> = ({
       }).format(date);
 
       bottomValues.push(
-        <text
-          key={date.getTime()}
-          y={headerHeight * 0.8}
-          x={columnWidth * (i + +rtl)}
-          className={styles.calendarBottomText}
-          fontFamily={fontFamily}
-        >
-          {bottomValue}
-        </text>
+        <g key={date.getTime()}>
+          <line
+            x1={columnWidth * i}
+            y1={headerHeight * 0.6}
+            x2={columnWidth * i}
+            y2={headerHeight}
+            style={{ stroke: "black", strokeWidth: 1 }}
+          />
+          <text
+            y={headerHeight * 0.8}
+            x={columnWidth * i + columnWidth * 0.5}
+            textAnchor="middle"
+            alignmentBaseline="middle"
+            className={styles.calendarBottomText}
+          >
+            {bottomValue}
+          </text>
+        </g>
       );
       if (i === 0 || date.getDate() !== dates[i - 1].getDate()) {
-        const topValue = `${getLocalDayOfWeek(
-          date,
-          locale,
-          "short"
-        )}, ${date.getDate()} ${getLocaleMonth(date, locale)}`;
+        const topValue =
+          locale === "kor"
+            ? `${getLocaleMonth(
+                date,
+                locale
+              )} ${date.getDate()}일 (${getLocalDayOfWeek(
+                date,
+                locale,
+                "short"
+              )})`
+            : `${getLocalDayOfWeek(
+                date,
+                locale,
+                "short"
+              )}, ${date.getDate()} ${getLocaleMonth(date, locale)}`;
         topValues.push(
           <TopPartOfCalendar
             key={topValue + date.getFullYear()}
@@ -320,23 +396,42 @@ export const Calendar: React.FC<CalendarProps> = ({
       }).format(date);
 
       bottomValues.push(
-        <text
-          key={date.getTime()}
-          y={headerHeight * 0.8}
-          x={columnWidth * (i + +rtl)}
-          className={styles.calendarBottomText}
-          fontFamily={fontFamily}
-        >
-          {bottomValue}
-        </text>
+        <g key={date.getTime()}>
+          <line
+            x1={columnWidth * i}
+            y1={headerHeight * 0.6}
+            x2={columnWidth * i}
+            y2={headerHeight}
+            style={{ stroke: "black", strokeWidth: 1 }}
+          />
+          <text
+            y={headerHeight * 0.8}
+            x={columnWidth * i + columnWidth * 0.5}
+            textAnchor="middle"
+            alignmentBaseline="middle"
+            className={styles.calendarBottomText}
+          >
+            {bottomValue}
+          </text>
+        </g>
       );
       if (i !== 0 && date.getDate() !== dates[i - 1].getDate()) {
         const displayDate = dates[i - 1];
-        const topValue = `${getLocalDayOfWeek(
-          displayDate,
-          locale,
-          "long"
-        )}, ${displayDate.getDate()} ${getLocaleMonth(displayDate, locale)}`;
+        const topValue =
+          locale === "kor"
+            ? `${getLocaleMonth(
+                displayDate,
+                locale
+              )} ${displayDate.getDate()}일 (${getLocalDayOfWeek(
+                displayDate,
+                locale,
+                "long"
+              )})`
+            : `${getLocalDayOfWeek(
+                date,
+                locale,
+                "long"
+              )}, ${date.getDate()} ${getLocaleMonth(date, locale)}`;
         const topPosition = (date.getHours() - 24) / 2;
         topValues.push(
           <TopPartOfCalendar
diff --git a/src/components/grid/grid-body.tsx b/src/components/grid/grid-body.tsx
index af689e509..9f110e229 100644
--- a/src/components/grid/grid-body.tsx
+++ b/src/components/grid/grid-body.tsx
@@ -88,13 +88,41 @@ export const GridBody: React.FC<GridBodyProps> = ({
         ).getTime() >= now.getTime())
     ) {
       today = (
-        <rect
-          x={tickX}
-          y={0}
-          width={columnWidth}
-          height={y}
-          fill={todayColor}
-        />
+        <svg z={1000}>
+          {/* 사각형 (배경) */}
+          <rect
+            x={tickX}
+            y={0}
+            width={columnWidth}
+            height={y}
+            fill={todayColor}
+          />
+
+          {/* 중앙 세로선 */}
+          <rect
+            x={tickX + columnWidth / 2 - 0.5}
+            y={5}
+            width={1}
+            height={y - 5}
+            style={{
+              fill: "#fea362",
+              stroke: "#fea362",
+              strokeWidth: 1,
+            }}
+          />
+
+          {/* 세로로 긴 역삼각형 화살표 머리 */}
+          <polygon
+            points={`${tickX + columnWidth / 2 - 5},0  ${
+              tickX + columnWidth / 2 + 5
+            },0  ${tickX + columnWidth / 2},5    `}
+            style={{
+              fill: "#fea362",
+              stroke: "#fea362",
+              strokeWidth: 1,
+            }}
+          />
+        </svg>
       );
     }
     // rtl for today
diff --git a/src/components/other/tooltip.tsx b/src/components/other/tooltip.tsx
index 7542a14eb..938a09076 100644
--- a/src/components/other/tooltip.tsx
+++ b/src/components/other/tooltip.tsx
@@ -123,13 +123,18 @@ export const StandardTooltipContent: React.FC<{
   };
   return (
     <div className={styles.tooltipDefaultContainer} style={style}>
-      <b style={{ fontSize: fontSize + 6 }}>{`${
-        task.name
-      }: ${task.start.getDate()}-${
-        task.start.getMonth() + 1
-      }-${task.start.getFullYear()} - ${task.end.getDate()}-${
-        task.end.getMonth() + 1
-      }-${task.end.getFullYear()}`}</b>
+      <b style={{ fontSize: fontSize + 6 }}>{`${task.name}`}</b>
+      <p></p>
+      <p
+        className={styles.tooltipDefaultContainerParagraph}
+        style={{ marginTop: 4 }}
+      >
+        {`date : ${task.start.getFullYear()}-${
+          task.start.getMonth() + 1
+        }-${task.start.getDate()} ~ ${task.end.getFullYear()}-${
+          task.end.getMonth() + 1
+        }-${task.end.getDate()}`}
+      </p>
       {task.end.getTime() - task.start.getTime() !== 0 && (
         <p className={styles.tooltipDefaultContainerParagraph}>{`Duration: ${~~(
           (task.end.getTime() - task.start.getTime()) /
diff --git a/src/components/task-item/project/project.tsx b/src/components/task-item/project/project.tsx
index 5a47ba90b..8793b2cbc 100644
--- a/src/components/task-item/project/project.tsx
+++ b/src/components/task-item/project/project.tsx
@@ -11,23 +11,6 @@ export const Project: React.FC<TaskItemProps> = ({ task, isSelected }) => {
     : task.styles.progressColor;
   const projectWith = task.x2 - task.x1;
 
-  const projectLeftTriangle = [
-    task.x1,
-    task.y + task.height / 2 - 1,
-    task.x1,
-    task.y + task.height,
-    task.x1 + 15,
-    task.y + task.height / 2 - 1,
-  ].join(",");
-  const projectRightTriangle = [
-    task.x2,
-    task.y + task.height / 2 - 1,
-    task.x2,
-    task.y + task.height,
-    task.x2 - 15,
-    task.y + task.height / 2 - 1,
-  ].join(",");
-
   return (
     <g tabIndex={0} className={styles.projectWrapper}>
       <rect
@@ -49,26 +32,6 @@ export const Project: React.FC<TaskItemProps> = ({ task, isSelected }) => {
         rx={task.barCornerRadius}
         fill={processColor}
       />
-      <rect
-        fill={barColor}
-        x={task.x1}
-        width={projectWith}
-        y={task.y}
-        height={task.height / 2}
-        rx={task.barCornerRadius}
-        ry={task.barCornerRadius}
-        className={styles.projectTop}
-      />
-      <polygon
-        className={styles.projectTop}
-        points={projectLeftTriangle}
-        fill={barColor}
-      />
-      <polygon
-        className={styles.projectTop}
-        points={projectRightTriangle}
-        fill={barColor}
-      />
     </g>
   );
 };
diff --git a/src/components/task-item/task-item.tsx b/src/components/task-item/task-item.tsx
index 0f5c769ce..cbdf829c6 100644
--- a/src/components/task-item/task-item.tsx
+++ b/src/components/task-item/task-item.tsx
@@ -117,6 +117,7 @@ export const TaskItem: React.FC<TaskItemProps> = props => {
             : style.barLabel && style.barLabelOutside
         }
         ref={textRef}
+        fontSize={12}
       >
         {task.name}
       </text>
diff --git a/src/helpers/date-helper.ts b/src/helpers/date-helper.ts
index 8c495a374..d5285b251 100644
--- a/src/helpers/date-helper.ts
+++ b/src/helpers/date-helper.ts
@@ -216,6 +216,30 @@ const getMonday = (date: Date) => {
   return new Date(date.setDate(diff));
 };
 
+export const getWeekOfMonth = (date: any) => {
+  // 주어진 날짜의 첫 번째 날을 가져옵니다.
+  const startOfMonth = new Date(date.getFullYear(), date.getMonth(), 1);
+
+  // 주어진 날짜의 첫 번째 월요일을 가져옵니다.
+  const firstMonday: any = new Date(startOfMonth);
+  while (firstMonday.getDay() !== 1) {
+    firstMonday.setDate(firstMonday.getDate() + 1);
+  }
+
+  // 주어진 날짜와 첫 번째 월요일 사이의 일수를 계산합니다.
+  const diffDays = Math.ceil((date - firstMonday) / (24 * 60 * 60 * 1000));
+
+  // 주 수를 계산합니다. 주어진 날짜가 첫 번째 월요일 이전이면 1주차로 간주합니다.
+  const weekNumber = Math.ceil((diffDays + 1) / 7);
+
+  // 만약 주어진 날짜가 첫 번째 월요일보다 앞에 있다면 첫 번째 주로 간주합니다.
+  if (diffDays < 0) {
+    return 1;
+  }
+
+  return weekNumber;
+};
+
 export const getWeekNumberISO8601 = (date: Date) => {
   const tmpDate = new Date(date.valueOf());
   const dayNumber = (tmpDate.getDay() + 6) % 7;