diff --git a/packages/ui/src/components/Button/Button.tsx b/packages/ui/src/components/Button/Button.tsx
index 06c6cf7..01f76be 100644
--- a/packages/ui/src/components/Button/Button.tsx
+++ b/packages/ui/src/components/Button/Button.tsx
@@ -18,7 +18,13 @@ export type ButtonType = <C extends ElementType = 'button'>(
   props: PropsWithChildren<Props<C>>,
 ) => JSX.Element
 
-export const Button: ButtonType = ({ as, className, size, children }) => {
+export const Button: ButtonType = ({
+  as,
+  className,
+  size,
+  children,
+  ...restProps
+}) => {
   const Component = as || 'button'
 
   return (
@@ -33,8 +39,9 @@ export const Button: ButtonType = ({ as, className, size, children }) => {
         BUTTON_SIZE[size],
         className,
       )}
+      {...restProps}
     >
-      <Text as={'span'} variant={BUTTON_FONT_SIZE[size]}>
+      <Text as='span' variant={BUTTON_FONT_SIZE[size]}>
         {children}
       </Text>
     </Component>
diff --git a/packages/ui/src/components/Chip/Chip.stories.tsx b/packages/ui/src/components/Chip/Chip.stories.tsx
index 0fcd17e..d57c3f1 100644
--- a/packages/ui/src/components/Chip/Chip.stories.tsx
+++ b/packages/ui/src/components/Chip/Chip.stories.tsx
@@ -14,10 +14,10 @@ type Story = StoryObj<typeof Chip>
 export const Default: Story = {
   render: () => (
     <Flex className='ui:gap-2'>
-      <Chip type='SOLO_FRIENDLY' />
-      <Chip type='GOOD_AMBIENCE' />
-      <Chip type='VALUE_FOR_MONEY' />
-      <Chip type='KIND_SERVICE' />
+      <Chip chipType='SOLO_FRIENDLY' />
+      <Chip chipType='GOOD_AMBIENCE' />
+      <Chip chipType='VALUE_FOR_MONEY' />
+      <Chip chipType='KIND_SERVICE' />
     </Flex>
   ),
 }
@@ -32,12 +32,12 @@ export const ClickableChips: Story = {
           'GOOD_AMBIENCE',
           'KIND_SERVICE',
         ] as const
-      ).map((type) => (
+      ).map((chipType) => (
         <Chip
-          key={type}
-          type={type}
+          key={chipType}
+          chipType={chipType}
           onToggle={() => {
-            console.log(`${type} 클릭됨!`)
+            console.log(`${chipType} 클릭됨!`)
           }}
         />
       ))}
diff --git a/packages/ui/src/components/Chip/Chip.tsx b/packages/ui/src/components/Chip/Chip.tsx
index 5081739..55bc627 100644
--- a/packages/ui/src/components/Chip/Chip.tsx
+++ b/packages/ui/src/components/Chip/Chip.tsx
@@ -30,7 +30,7 @@ type ChipTagKey = keyof typeof CHIP_TAGS
 export type ChipProps<C extends ElementType> = PolymorphicComponentProps<
   C,
   {
-    type: ChipTagKey
+    chipType: ChipTagKey
     onToggle?: () => void
   }
 >
@@ -50,7 +50,7 @@ export type ChipType = <C extends ElementType = 'button'>(
  *
  * @param as 렌더링할 HTML 태그 또는 컴포넌트
  * @param className 추가 CSS 클래스
- * @param type 표시할 Chip 타입
+ * @param chipType 표시할 Chip 타입
  * @param onToggle 클릭 시 실행할 콜백 함수
  * @param restProps 나머지 Props
  *
@@ -62,12 +62,12 @@ export type ChipType = <C extends ElementType = 'button'>(
 export const Chip: ChipType = ({
   as,
   className,
-  type,
+  chipType,
   onToggle,
   ...restProps
 }) => {
   const Component = as || 'button'
-  const { icon, label } = CHIP_TAGS[type]
+  const { icon, label } = CHIP_TAGS[chipType]
   const [isActive, setIsActive] = useState(false)
 
   const onClick = () => {
diff --git a/packages/ui/src/components/Icon/IconMap.ts b/packages/ui/src/components/Icon/IconMap.ts
index 798c4f6..86f61f0 100644
--- a/packages/ui/src/components/Icon/IconMap.ts
+++ b/packages/ui/src/components/Icon/IconMap.ts
@@ -93,7 +93,7 @@ export const iconMap = {
   note: Note,
   smile: Smile,
   cry: Cry,
-  kakkoLogo: KakaoLogo,
+  kakaoLogo: KakaoLogo,
   crosshairs: Crosshairs,
 }
 
diff --git a/packages/ui/src/components/SearchBar/SearchBar.tsx b/packages/ui/src/components/SearchBar/SearchBar.tsx
index 4b21f7a..0ec8bbe 100644
--- a/packages/ui/src/components/SearchBar/SearchBar.tsx
+++ b/packages/ui/src/components/SearchBar/SearchBar.tsx
@@ -7,7 +7,7 @@ export const SearchBar = ({ href }: { href: string }) => {
   return (
     <Flex
       as='a'
-      href={href || ''}
+      href={href}
       className={cn(
         'ui:border ui:border-gray-200',
         'ui:rounded-xl',
@@ -15,6 +15,7 @@ export const SearchBar = ({ href }: { href: string }) => {
         'ui:items-center',
         'ui:gap-2',
       )}
+      aria-label={'검색 페이지로 이동'}
     >
       <Icon type={'search'} size={16} />
       <Text
diff --git a/packages/ui/src/components/Textarea/Textarea.tsx b/packages/ui/src/components/Textarea/Textarea.tsx
index 086b9c1..6c6027f 100644
--- a/packages/ui/src/components/Textarea/Textarea.tsx
+++ b/packages/ui/src/components/Textarea/Textarea.tsx
@@ -1,6 +1,6 @@
 'use client'
 
-import { useLayoutEffect, useRef } from 'react'
+import { useId, useLayoutEffect, useRef } from 'react'
 import { Column } from '../Layout'
 import { cn } from '../../utils/cn'
 import { Text } from '../Text'
@@ -36,6 +36,7 @@ export const Textarea = ({
   maxLength = 1000,
   className,
 }: Props) => {
+  const id = useId()
   const textareaRef = useRef<HTMLTextAreaElement>(null)
 
   useLayoutEffect(() => {
@@ -54,6 +55,7 @@ export const Textarea = ({
   return (
     <Column>
       <textarea
+        name={`message-${id}`}
         ref={textareaRef}
         value={value}
         maxLength={maxLength}
diff --git a/packages/ui/src/styles.css b/packages/ui/src/styles.css
index 1bd837f..e61af70 100644
--- a/packages/ui/src/styles.css
+++ b/packages/ui/src/styles.css
@@ -1,4 +1,4 @@
 /* Component-level styles for the UI package */
+@config "../tailwind.config.ts";
 @import "tailwindcss" prefix(ui);
-@import "@repo/tailwind-config";
-@config "../tailwind.config.ts";
\ No newline at end of file
+@import "@repo/tailwind-config";
\ No newline at end of file