diff --git a/client/src/components/Design/components/Top/Line.tsx b/client/src/components/Design/components/Top/Line.tsx
index 06669eb1b..f2e9081a5 100644
--- a/client/src/components/Design/components/Top/Line.tsx
+++ b/client/src/components/Design/components/Top/Line.tsx
@@ -31,6 +31,7 @@ export default function Line({text, emphasize = []}: Props) {
             size="subTitle"
             textColor={emphasize.includes(text) ? 'black' : 'gray'}
             style={{whiteSpace: 'pre'}}
+            aria-hidden={true}
           >
             {`${text}`}
           </Text>
diff --git a/client/src/components/Design/components/Top/Top.tsx b/client/src/components/Design/components/Top/Top.tsx
index 56c41eb6e..11b2b9586 100644
--- a/client/src/components/Design/components/Top/Top.tsx
+++ b/client/src/components/Design/components/Top/Top.tsx
@@ -1,5 +1,6 @@
 /** @jsxImportSource @emotion/react */
 import {css} from '@emotion/react';
+import React from 'react';
 
 import Line from './Line';
 import EditableLine from './EditableLine';
@@ -8,12 +9,21 @@ Top.Line = Line;
 Top.EditableLine = EditableLine;
 
 export default function Top({children}: React.PropsWithChildren) {
+  const childrenTexts: string[] = [];
+  React.Children.forEach(children, child => {
+    if (React.isValidElement(child) && child.type === Top.Line) {
+      childrenTexts.push(child.props.text);
+    }
+  });
+
   return (
     <div
       css={css`
         display: flex;
         flex-direction: column;
       `}
+      aria-label={childrenTexts.join(' ')}
+      tabIndex={0}
     >
       {children}
     </div>