diff --git a/src/components/MessageItem.tsx b/src/components/MessageItem.tsx
index b4f4bc8..53edb4d 100644
--- a/src/components/MessageItem.tsx
+++ b/src/components/MessageItem.tsx
@@ -5,6 +5,7 @@ import { Avatar, AvatarImage, AvatarFallback } from '@/components/ui/Avatar'
 
 import LikeButton from '@/components/LikeButton'
 import { type Message } from '@/domain/MessageList'
+import { Markdown } from '@/components/ui/Markdown'
 
 export interface MessageItemProps {
   data: Message
@@ -39,7 +40,7 @@ const MessageItem: FC<MessageItemProps> = ({ data }) => {
         </div>
         <div>
           <div className="pb-2">
-            <pre className="text-sm">{formatData.body}</pre>
+            <Markdown>{formatData.body}</Markdown>
           </div>
           <div className="grid grid-flow-col justify-end gap-x-2 leading-none">
             <LikeButton
diff --git a/src/views/Footer/index.tsx b/src/views/Footer/index.tsx
index cf333f9..ca31a3d 100644
--- a/src/views/Footer/index.tsx
+++ b/src/views/Footer/index.tsx
@@ -5,6 +5,7 @@ import { Button } from '@/components/ui/Button'
 import MessageInput from '@/components/MessageInput'
 import MessageInputDomain from '@/domain/MessageInput'
 import MessageListDomain from '@/domain/MessageList'
+import { MESSAGE_MAX_LENGTH } from '@/constants'
 
 const Footer: FC = () => {
   const send = useRemeshSend()
@@ -36,7 +37,13 @@ const Footer: FC = () => {
 
   return (
     <div className="grid gap-y-2 p-4">
-      <MessageInput value={message} preview={isPreview} onEnter={handleSend} onInput={handleInput}></MessageInput>
+      <MessageInput
+        value={message}
+        preview={isPreview}
+        onEnter={handleSend}
+        onInput={handleInput}
+        maxLength={MESSAGE_MAX_LENGTH}
+      ></MessageInput>
       <div className="grid grid-cols-[auto_auto_1fr] items-center justify-items-end">
         <Button variant="ghost" size="icon">
           <SmileIcon size={20} />