diff --git a/packages/button/index.less b/packages/button/index.less
index cf48e5a2..a1f3dba7 100644
--- a/packages/button/index.less
+++ b/packages/button/index.less
@@ -11,6 +11,7 @@
   line-height: 42px;
   text-align: center;
   vertical-align: middle;
+  transition: opacity @animation-duration-fast;
   .theme(border-radius, '@button-border-radius');
 
   -webkit-appearance: none;
diff --git a/packages/common/style/var.less b/packages/common/style/var.less
index d25a4023..9463c070 100644
--- a/packages/common/style/var.less
+++ b/packages/common/style/var.less
@@ -33,6 +33,10 @@
 @font-size-md: 14px;
 @font-size-lg: 16px;
 
+// Animation
+@animation-duration-base: .3s;
+@animation-duration-fast: .2s;
+
 // Button
 @button-default-color: @text-color;
 @button-default-background-color: @white;