diff --git a/src/smart-components/Channel/components/MessageInput/index.tsx b/src/smart-components/Channel/components/MessageInput/index.tsx
index f6f613b6f..6e6e5095b 100644
--- a/src/smart-components/Channel/components/MessageInput/index.tsx
+++ b/src/smart-components/Channel/components/MessageInput/index.tsx
@@ -112,7 +112,7 @@ const MessageInputWrapper = (
   }
   // other conditions
   return (
-    <div className="sendbird-message-input-wrapper">
+    <div className={`sendbird-message-input-wrapper${showVoiceMessageInput ? '--voice-message' : ''}`}>
       {
         displaySuggestedMentionList && (
           <SuggestedMentionList
diff --git a/src/smart-components/Channel/components/MessageInput/message-input.scss b/src/smart-components/Channel/components/MessageInput/message-input.scss
index f6bafb76b..f32424153 100644
--- a/src/smart-components/Channel/components/MessageInput/message-input.scss
+++ b/src/smart-components/Channel/components/MessageInput/message-input.scss
@@ -1,5 +1,6 @@
 @import '../../../../styles/variables';
 
+.sendbird-message-input-wrapper--voice-message,
 .sendbird-message-input-wrapper {
   position: relative;
   width: 100%;
@@ -20,3 +21,9 @@
     padding-right: 24px;
   }
 }
+
+.sendbird-message-input-wrapper--voice-message {
+  @include themed() {
+    border-top: 1px solid t(on-bg-4);
+  }
+}
diff --git a/src/smart-components/Thread/components/ThreadMessageInput/index.scss b/src/smart-components/Thread/components/ThreadMessageInput/index.scss
index 4ab98c368..b52d56fe8 100644
--- a/src/smart-components/Thread/components/ThreadMessageInput/index.scss
+++ b/src/smart-components/Thread/components/ThreadMessageInput/index.scss
@@ -16,3 +16,9 @@
 .sendbird-thread-message-input .sendbird-mention-suggest-list .sendbird-mention-suggest-list__user-item .sendbird-mention-suggest-list__user-item__user-id {
   max-width: 46px;
 }
+
+.sendbird-thread-message-input--voice-message {
+  @include themed() {
+    border-top: 1px solid t(on-bg-4);
+  }
+}
diff --git a/src/smart-components/Thread/components/ThreadMessageInput/index.tsx b/src/smart-components/Thread/components/ThreadMessageInput/index.tsx
index 625bfcb19..4d8ce6c17 100644
--- a/src/smart-components/Thread/components/ThreadMessageInput/index.tsx
+++ b/src/smart-components/Thread/components/ThreadMessageInput/index.tsx
@@ -95,7 +95,7 @@ const ThreadMessageInput = (
   }
 
   return (
-    <div className={`sendbird-thread-message-input ${className}`}>
+    <div className={`sendbird-thread-message-input${showVoiceMessageInput ? '--voice-message' : ''} ${className}`}>
       {
         displaySuggestedMentionList && (
           <SuggestedMentionList