diff --git a/packages/common/style/var.less b/packages/common/style/var.less
index 7ae21088..7d9b946b 100644
--- a/packages/common/style/var.less
+++ b/packages/common/style/var.less
@@ -292,6 +292,16 @@
 @popup-close-icon-margin: 16px;
 @popup-close-icon-z-index: 1;
 
+// Progress
+@progress-height: 4px;
+@progress-background-color: @gray-light;
+@progress-pivot-padding: 0 5px;
+@progress-color: @blue;
+@progress-pivot-font-size: @font-size-xs;
+@progress-pivot-line-height: 1.6;
+@progress-pivot-background-color: @blue;
+@progress-pivot-text-color: @white;
+
 // Radio
 @radio-size: 20px;
 @radio-border-color: @gray-light;
diff --git a/packages/progress/index.less b/packages/progress/index.less
index 77392374..b2370b96 100644
--- a/packages/progress/index.less
+++ b/packages/progress/index.less
@@ -3,15 +3,16 @@
 
 .van-progress {
   position: relative;
-  height: 4px;
-  border-radius: 4px;
-  .theme(background, '@gray-light');
+  .theme(height, '@progress-height');
+  .theme(border-radius, '@progress-height');
+  .theme(background, '@progress-background-color');
 
   &__portion {
     position: absolute;
     left: 0;
     height: 100%;
     border-radius: inherit;
+    .theme(background, '@progress-color');
   }
 
   &__pivot {
@@ -20,13 +21,14 @@
     right: 0;
     box-sizing: border-box;
     min-width: 2em;
-    padding: 0 5px;
-    font-size: 10px;
-    line-height: 1.6;
     text-align: center;
     word-break: keep-all;
     border-radius: 1em;
     transform: translateY(-50%);
-    .theme(background-color, '@gray-light');
+    .theme(color, '@progress-pivot-text-color');
+    .theme(padding, '@progress-pivot-padding');
+    .theme(font-size, '@progress-pivot-font-size');
+    .theme(line-height, '@progress-pivot-line-height');
+    .theme(background-color, '@progress-pivot-background-color');
   }
 }