diff --git a/src/style/var.less b/src/style/var.less
index bdcec1090..dec245472 100644
--- a/src/style/var.less
+++ b/src/style/var.less
@@ -606,6 +606,7 @@
 @swipe-indicator-inactive-background-color: @border-color;
 
 // Switch
+@switch-size: 30px;
 @switch-width: 2em;
 @switch-height: 1em;
 @switch-node-size: 1em;
diff --git a/src/switch/index.less b/src/switch/index.less
index 7a0c523e1..3dbc9c559 100644
--- a/src/switch/index.less
+++ b/src/switch/index.less
@@ -6,6 +6,7 @@
   box-sizing: content-box;
   width: @switch-width;
   height: @switch-height;
+  font-size: @switch-size;
   background-color: @switch-background-color;
   border: @switch-border;
   border-radius: @switch-node-size;
diff --git a/src/switch/shared.ts b/src/switch/shared.ts
index 296bd0354..8ee1b375b 100644
--- a/src/switch/shared.ts
+++ b/src/switch/shared.ts
@@ -14,6 +14,7 @@ export type SharedSwitchProps = {
 };
 
 export const switchProps = {
+  size: String,
   value: null as any,
   loading: Boolean,
   disabled: Boolean,
@@ -26,9 +27,5 @@ export const switchProps = {
   inactiveValue: {
     type: null as any,
     default: false
-  },
-  size: {
-    type: String,
-    default: '30px'
   }
 };
diff --git a/src/switch/test/__snapshots__/demo.spec.js.snap b/src/switch/test/__snapshots__/demo.spec.js.snap
index 373b66449..6f2db155b 100644
--- a/src/switch/test/__snapshots__/demo.spec.js.snap
+++ b/src/switch/test/__snapshots__/demo.spec.js.snap
@@ -3,17 +3,17 @@
 exports[`renders demo correctly 1`] = `
 <div>
   <div>
-    <div role="switch" aria-checked="true" class="van-switch van-switch--on" style="font-size: 30px;">
+    <div role="switch" aria-checked="true" class="van-switch van-switch--on">
       <div class="van-switch__node"></div>
     </div>
   </div>
   <div>
-    <div role="switch" aria-checked="true" class="van-switch van-switch--on van-switch--disabled" style="font-size: 30px;">
+    <div role="switch" aria-checked="true" class="van-switch van-switch--on van-switch--disabled">
       <div class="van-switch__node"></div>
     </div>
   </div>
   <div>
-    <div role="switch" aria-checked="true" class="van-switch van-switch--on" style="font-size: 30px;">
+    <div role="switch" aria-checked="true" class="van-switch van-switch--on">
       <div class="van-switch__node">
         <div class="van-loading van-loading--circular van-switch__loading"><span class="van-loading__spinner van-loading__spinner--circular" style="color: rgb(25, 137, 250);"><svg viewBox="25 25 50 50" class="van-loading__circular"><circle cx="50" cy="50" r="20" fill="none"></circle></svg></span></div>
       </div>
@@ -25,12 +25,12 @@ exports[`renders demo correctly 1`] = `
     </div>
   </div>
   <div>
-    <div role="switch" aria-checked="true" class="van-switch van-switch--on" style="font-size: 30px; background-color: rgb(7, 193, 96);">
+    <div role="switch" aria-checked="true" class="van-switch van-switch--on" style="background-color: rgb(7, 193, 96);">
       <div class="van-switch__node"></div>
     </div>
   </div>
   <div>
-    <div role="switch" aria-checked="true" class="van-switch van-switch--on" style="font-size: 30px;">
+    <div role="switch" aria-checked="true" class="van-switch van-switch--on">
       <div class="van-switch__node"></div>
     </div>
   </div>
diff --git a/src/switch/test/__snapshots__/index.spec.js.snap b/src/switch/test/__snapshots__/index.spec.js.snap
index 76c23a337..8a9a87679 100644
--- a/src/switch/test/__snapshots__/index.spec.js.snap
+++ b/src/switch/test/__snapshots__/index.spec.js.snap
@@ -1,7 +1,7 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`inactive-color prop 1`] = `
-<div role="switch" aria-checked="false" class="van-switch" style="font-size: 30px; background-color: black;">
+<div role="switch" aria-checked="false" class="van-switch" style="background-color: black;">
   <div class="van-switch__node"></div>
 </div>
 `;