diff --git a/packages/opendesign/src/message/OMessage.vue b/packages/opendesign/src/message/OMessage.vue
index 5994696663810ab6f83eaf6172d88decf95a1073..d2ca84d66564495dfca68422d05d9426e1d1a0fa 100644
--- a/packages/opendesign/src/message/OMessage.vue
+++ b/packages/opendesign/src/message/OMessage.vue
@@ -24,7 +24,7 @@ watch(
     if (!isUndefined(val)) {
       isVisible.value = val;
     }
-  }
+  },
 );
 
 const emits = defineEmits<{
@@ -98,9 +98,16 @@ defineExpose({
       </slot>
     </span>
 
-    <span class="o-message-content">
-      <slot></slot>
-    </span>
+    <div class="o-message-main">
+      <span v-if="$slots.title || props.title" class="o-message-title">
+        <slot name="title">
+          {{ props.title }}
+        </slot>
+      </span>
+      <span class="o-message-content">
+        <slot></slot>
+      </span>
+    </div>
 
     <span v-if="props.closable" class="o-message-close" @click="onClose">
       <IconClose />
diff --git a/packages/opendesign/src/message/__demo__/MessageColorful.vue b/packages/opendesign/src/message/__demo__/MessageColorful.vue
index ef60f8b733d7dc33f92131dbaccd2232004eb090..4f0dfaba2f420402c048c05c0b633f841efb513c 100644
--- a/packages/opendesign/src/message/__demo__/MessageColorful.vue
+++ b/packages/opendesign/src/message/__demo__/MessageColorful.vue
@@ -7,19 +7,19 @@ import { OMessage } from '../index';
   <h4>内联使用</h4>
   <section>
     <div>
-      <OMessage status="info" colorful>用于表示普通操作信息提示</OMessage>
-      <OMessage status="success" colorful>用于表示操作顺利达成</OMessage>
-      <OMessage status="warning" colorful>用于表示操作引起一定后果</OMessage>
-      <OMessage status="danger" colorful>用于表示操作引起严重的后果</OMessage>
-      <OMessage status="loading" colorful>排队中，请稍后</OMessage>
+      <OMessage status="info" colorful title="info">用于表示普通操作信息提示</OMessage>
+      <OMessage status="success" colorful title="success">用于表示操作顺利达成</OMessage>
+      <OMessage status="warning" colorful title="warning">用于表示操作引起一定后果</OMessage>
+      <OMessage status="danger" colorful title="danger">用于表示操作引起严重的后果</OMessage>
+      <OMessage status="loading" colorful title="loading">排队中，请稍后</OMessage>
     </div>
 
     <div>
-      <OMessage status="info" closable colorful>用于表示普通操作信息提示（提示常驻，可手动关闭）</OMessage>
-      <OMessage status="success" :duration="3000" colorful>用于表示操作顺利达成（提示3秒后消失）</OMessage>
-      <OMessage status="warning" :duration="5000" colorful>用于表示操作引起一定后果（提示5秒后消失）</OMessage>
-      <OMessage status="danger" :duration="8000" colorful>用于表示操作引起严重的后果（提示8秒后消失）</OMessage>
-      <OMessage status="loading" :duration="10000" colorful>排队中，请稍后（提示10秒后消失）</OMessage>
+      <OMessage status="info" closable colorful title="info">用于表示普通操作信息提示（提示常驻，可手动关闭）</OMessage>
+      <OMessage status="success" :duration="3000" colorful title="success">用于表示操作顺利达成（提示3秒后消失）</OMessage>
+      <OMessage status="warning" :duration="5000" colorful title="warning">用于表示操作引起一定后果（提示5秒后消失）</OMessage>
+      <OMessage status="danger" :duration="8000" colorful title="danger">用于表示操作引起严重的后果（提示8秒后消失）</OMessage>
+      <OMessage status="loading" :duration="10000" colorful title="loading">排队中，请稍后（提示10秒后消失）</OMessage>
     </div>
   </section>
 </template>
diff --git a/packages/opendesign/src/message/style/media.scss b/packages/opendesign/src/message/style/media.scss
index 4acfb5fa24cc428a0cff49210c9a4943156c9b9e..46cbfb7a5d11c5787e211f8d6bd57fac26e47445 100644
--- a/packages/opendesign/src/message/style/media.scss
+++ b/packages/opendesign/src/message/style/media.scss
@@ -1,12 +1,14 @@
 @use '../../_styles/mixin.scss' as *;
 
+@include respond-to('pad_v-pc_s') {
+  .o-message.o-message-colorful {
+    --message-padding: 4px 8px 8px;
+  }
+}
+
 @include respond-to('laptop') {
   .o-message {
-    --message-text-size: var(--o-font_size-tip1);
-    --message-text-height: var(--o-line_height-tip1);
     --message-padding: 7px 12px;
-    --message-icon-size: var(--o-icon_size_control-s);
-    --message-icon-gap: 8px;
     --message-gap: 12px;
   }
 }
@@ -15,9 +17,17 @@
   .o-message {
     --message-text-size: var(--o-font_size-tip2);
     --message-text-height: var(--o-line_height-tip2);
+
+    --message-title-size: var(--o-font_size-tip2);
+    --message-title-height: var(--o-line_height-tip2);
+
     --message-padding: 7px 12px;
-    --message-icon-size: var(--o-icon_size_control-xs);
-    --message-icon-gap: 8px;
     --message-gap: 8px;
   }
 }
+
+@include respond-to('<=pad_v') {
+  .o-message-colorful {
+    --message-padding: 4px 12px 8px;
+  }
+}
\ No newline at end of file
diff --git a/packages/opendesign/src/message/style/style.scss b/packages/opendesign/src/message/style/style.scss
index f7c630b708fa4709ddddb780d8c11c53aea37133..e6b7b184b16579960f9bafdfb1fb5b1993ee24a7 100644
--- a/packages/opendesign/src/message/style/style.scss
+++ b/packages/opendesign/src/message/style/style.scss
@@ -13,10 +13,32 @@
   text-align: center;
 }
 
-.o-message-content {
+.o-message-colorful:not(.o-message-loading) {
+  overflow: hidden;
+  position: relative;
+  background-color: rgba(var(--message-bg-color), 0.05);
+
+  &:after {
+    content: '';
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 4px;
+    height: 100%;
+    background-color: rgb(var(--message-bg-color));
+  }
+}
+
+.o-message-main {
+  display: flex;
+  flex-direction: column;
+  align-items: flex-start;
   font-size: var(--message-text-size);
   line-height: var(--message-text-height);
   color: var(--message-color);
+}
+
+.o-message-content {
   overflow: hidden;
   text-overflow: ellipsis;
   text-align: var(--message-text-align);
@@ -26,6 +48,13 @@
   -webkit-box-orient: vertical;
 }
 
+.o-message-title {
+  margin-bottom: var(--message-title-gap);
+  font-size: var(--message-title-size);
+  line-height: var(--message-title-height);
+  font-weight: 600;
+}
+
 .o-message-icon {
   font-size: var(--message-icon-size);
   color: var(--message-icon-color);
@@ -38,7 +67,7 @@
   display: inline-flex;
   align-items: center;
   cursor: pointer;
-  margin-left: calc(var(--message-icon-gap) * 2);
+  margin-left: var(--message-icon-gap);
   font-size: var(--message-icon-size);
   color: var(--message-icon-close-color);
   transition: color var(--o-duration-s) var(--o-easing-standard);
@@ -64,14 +93,16 @@
 
 .o-message-list-top {
   top: var(--message-list-offset);
-  .o-message + .o-message {
+
+  .o-message+.o-message {
     margin-top: var(--message-gap);
   }
 }
 
 .o-message-list-bottom {
   bottom: var(--message-list-offset);
-  .o-message + .o-message {
+
+  .o-message+.o-message {
     margin-top: var(--message-gap);
   }
 }
@@ -87,4 +118,4 @@
 
 .o-message-fade-leave-to {
   opacity: 0;
-}
+}
\ No newline at end of file
diff --git a/packages/opendesign/src/message/style/var.scss b/packages/opendesign/src/message/style/var.scss
index 1597d6d0eb6a61f6b6d5aa6ef60a703687ef5ae5..d67346e3d26fa4603cb41149d80629331fef9625 100644
--- a/packages/opendesign/src/message/style/var.scss
+++ b/packages/opendesign/src/message/style/var.scss
@@ -1,8 +1,11 @@
 .o-message {
-  --message-color: var(--o-color-info1);
+  --message-color: var(--o-color-info2);
 
-  --message-text-size: var(--o-font_size-text1);
-  --message-text-height: var(--o-line_height-text1);
+  --message-text-size: var(--o-font_size-tip1);
+  --message-text-height: var(--o-line_height-tip1);
+
+  --message-title-size: var(--o-font_size-tip1);
+  --message-title-height: var(--o-line_height-tip1);
 
   --message-bg-color: var(--o-color-fill2);
 
@@ -26,42 +29,52 @@
   --message-content-max-row: 0;
 
   --message-gap: 16px;
+  --message-title-gap: 4px;
 }
 
 .o-message-colorful {
   --message-shadow: none;
+  --message-padding: 4px 12px 8px;
+
+  --message-align: start;
+  --message-text-align: left;
 }
 
 .o-message-info {
-  --message-icon-color: var(--o-color-primary1);
+  --message-icon-color: var(--o-color-auxiliary5, rgb(var(--o-blue-6)));
+
   &.o-message-colorful {
-    --message-bg-color: var(--o-color-primary4-light);
+    --message-bg-color: var(--o-blue-6);
   }
 }
 
 .o-message-success {
-  --message-icon-color: var(--o-color-success1);
+  --message-icon-color: var(--o-color-success1, rgb(var(--o-green-6)));
+
   &.o-message-colorful {
-    --message-bg-color: var(--o-color-success4-light);
+    --message-bg-color: var(--o-green-6);
   }
 }
 
 .o-message-warning {
-  --message-icon-color: var(--o-color-warning1);
+  --message-icon-color: var(--o-color-warning1, rgb(var(--o-orange-6)));
+
   &.o-message-colorful {
-    --message-bg-color: var(--o-color-warning4-light);
+    --message-bg-color: var(--o-orange-6);
   }
 }
 
 .o-message-danger {
-  --message-icon-color: var(--o-color-danger1);
+  --message-icon-color: var(--o-color-danger1, rgb(var(--o-red-6)));
+
   &.o-message-colorful {
-    --message-bg-color: var(--o-color-danger4-light);
+    --message-bg-color: var(--o-red-6);
   }
 }
 
 .o-message-loading {
   --message-icon-color: var(--o-color-info1);
+
   &.o-message-colorful {
     --message-bg-color: var(--o-color-primary4-light);
   }
@@ -69,4 +82,4 @@
 
 .o-message-list {
   --message-list-offset: 32px;
-}
+}
\ No newline at end of file
diff --git a/packages/opendesign/src/message/types.ts b/packages/opendesign/src/message/types.ts
index a262e9070f51eff4425cf906b9dcc18671e64d95..38654b5a898478bea40851114790bd54db2064c8 100644
--- a/packages/opendesign/src/message/types.ts
+++ b/packages/opendesign/src/message/types.ts
@@ -53,6 +53,12 @@ export const messageProps = {
   beforeClose: {
     type: Function as PropType<() => Promise<boolean> | boolean>,
   },
+  /**
+   * 消息标题
+   */
+  title: {
+    type: String,
+  },
 };
 
 export const messageListProps = {