diff --git a/src/button/index.tsx b/src/button/index.tsx
index 7d430d0ae..22fde2884 100644
--- a/src/button/index.tsx
+++ b/src/button/index.tsx
@@ -57,16 +57,22 @@ function Button(
     loadingText
   } = props;
 
-  const style: Record<string, string> = {};
+  const style: Record<string, string | number> = {};
 
   if (color) {
-    style.borderColor = color;
     style.color = plain ? color : WHITE;
 
     if (!plain) {
       // Use background instead of backgroundColor to make linear-gradient work
       style.background = color;
     }
+
+    // hide border when color is linear-gradient
+    if (color.indexOf('gradient') !== -1) {
+      style.border = 0;
+    } else {
+      style.borderColor = color;
+    }
   }
 
   function onClick(event: Event) {
diff --git a/src/button/test/__snapshots__/demo.spec.js.snap b/src/button/test/__snapshots__/demo.spec.js.snap
index 4a14d2b39..f2f35cbee 100644
--- a/src/button/test/__snapshots__/demo.spec.js.snap
+++ b/src/button/test/__snapshots__/demo.spec.js.snap
@@ -32,6 +32,6 @@ exports[`renders demo correctly 1`] = `
       迷你按钮
     </span></button></div>
   <div><button class="van-button van-button--primary van-button--normal"><span class="van-button__text">URL 跳转</span></button> <button class="van-button van-button--primary van-button--normal"><span class="van-button__text">路由跳转</span></button></div>
-  <div><button class="van-button van-button--default van-button--normal" style="border-color: #7232dd; color: rgb(255, 255, 255); background: rgb(114, 50, 221);"><span class="van-button__text">自定义颜色</span></button> <button class="van-button van-button--default van-button--normal van-button--plain" style="border-color: #7232dd; color: rgb(114, 50, 221);"><span class="van-button__text">自定义颜色</span></button></div>
+  <div><button class="van-button van-button--default van-button--normal" style="color: rgb(255, 255, 255); background: rgb(114, 50, 221); border-color: #7232dd;"><span class="van-button__text">自定义颜色</span></button> <button class="van-button van-button--default van-button--normal van-button--plain" style="color: rgb(114, 50, 221); border-color: #7232dd;"><span class="van-button__text">自定义颜色</span></button></div>
 </div>
 `;
diff --git a/src/button/test/index.spec.js b/src/button/test/index.spec.js
index 143e46473..65ed46b18 100644
--- a/src/button/test/index.spec.js
+++ b/src/button/test/index.spec.js
@@ -72,3 +72,13 @@ test('touchstart event', () => {
   wrapper.trigger('touchstart');
   expect(onTouchstart).toHaveBeenCalled();
 });
+
+test('hide border when color is gradient', () => {
+  const wrapper = mount(Button, {
+    propsData: {
+      color: 'linear-gradient(#000, #fff)'
+    }
+  });
+
+  expect(wrapper.element.style.border).toEqual('0px');
+});
diff --git a/src/goods-action/test/__snapshots__/demo.spec.js.snap b/src/goods-action/test/__snapshots__/demo.spec.js.snap
index f89a54791..92b7adf09 100644
--- a/src/goods-action/test/__snapshots__/demo.spec.js.snap
+++ b/src/goods-action/test/__snapshots__/demo.spec.js.snap
@@ -46,7 +46,7 @@ exports[`renders demo correctly 1`] = `
         <div class="van-icon van-icon-cart-o van-goods-action-icon__icon">
           <!---->
         </div>购物车
-      </div> <button class="van-button van-button--warning van-button--large van-button--square van-goods-action-button van-goods-action-button--first van-goods-action-button--warning" style="border-color: #be99ff; color: rgb(255, 255, 255); background: rgb(190, 153, 255);"><span class="van-button__text">加入购物车</span></button> <button class="van-button van-button--danger van-button--large van-button--square van-goods-action-button van-goods-action-button--last van-goods-action-button--danger" style="border-color: #7232dd; color: rgb(255, 255, 255); background: rgb(114, 50, 221);"><span class="van-button__text">立即购买</span></button>
+      </div> <button class="van-button van-button--warning van-button--large van-button--square van-goods-action-button van-goods-action-button--first van-goods-action-button--warning" style="color: rgb(255, 255, 255); background: rgb(190, 153, 255); border-color: #be99ff;"><span class="van-button__text">加入购物车</span></button> <button class="van-button van-button--danger van-button--large van-button--square van-goods-action-button van-goods-action-button--last van-goods-action-button--danger" style="color: rgb(255, 255, 255); background: rgb(114, 50, 221); border-color: #7232dd;"><span class="van-button__text">立即购买</span></button>
     </div>
   </div>
 </div>