diff --git a/src/overlay/__test__/__snapshots__/demo.test.js.snap b/src/overlay/__test__/__snapshots__/demo.test.js.snap
index f75090237..d8af8fe83 100644
--- a/src/overlay/__test__/__snapshots__/demo.test.js.snap
+++ b/src/overlay/__test__/__snapshots__/demo.test.js.snap
@@ -8,6 +8,8 @@ exports[`Overlay Overlay base demo works fine 1`] = `
   />
   <t-button
     block="{{true}}"
+    size="large"
+    theme="primary"
     variant="outline"
     bind:tap="handleClick"
   >
diff --git a/src/overlay/_example/base/index.wxml b/src/overlay/_example/base/index.wxml
index 222055447..745f89467 100644
--- a/src/overlay/_example/base/index.wxml
+++ b/src/overlay/_example/base/index.wxml
@@ -1,3 +1,3 @@
 <t-overlay visible="{{visible}}" bind:click="handleOverlayClick" />
 
-<t-button block variant="outline" bind:tap="handleClick">基础用法</t-button>
+<t-button block size="large" theme="primary" variant="outline" bind:tap="handleClick">基础用法</t-button>
diff --git a/src/overlay/_example/overlay.wxml b/src/overlay/_example/overlay.wxml
index 9ac74080f..a1744e54b 100644
--- a/src/overlay/_example/overlay.wxml
+++ b/src/overlay/_example/overlay.wxml
@@ -1,7 +1,7 @@
 <view class="demo">
   <view class="demo-title">Overlay 遮罩层</view>
   <view class="demo-desc">通过遮罩层，可以强调部分内容</view>
-  <t-demo title="01 类型" desc="基础遮罩层">
+  <t-demo title="01 组件类型" desc="基础遮罩层">
     <view class="wrapper">
       <base />
     </view>
diff --git a/src/overlay/overlay.less b/src/overlay/overlay.less
index 244306a1c..265d49d5b 100644
--- a/src/overlay/overlay.less
+++ b/src/overlay/overlay.less
@@ -1,6 +1,8 @@
 @import '../common/style/index.less';
 
 @overlay: ~'@{prefix}-overlay';
+@overlay-bg-color: var(--td-overlay-bg-color, @font-gray-2);
+@overlay-transition-duration: var(--td-overlay-transition-duration, 300ms);
 
 .@{overlay} {
   position: fixed;
@@ -8,8 +10,8 @@
   left: 0;
   width: 100%;
   bottom: 0;
-  background-color: rgba(0, 0, 0, 0.6);
-  transition: opacity 300ms ease;
+  background-color: @overlay-bg-color;
+  transition: opacity @overlay-transition-duration ease;
 }
 
 .t-fade-enter {