diff --git a/src/contact-list/index.less b/src/contact-list/index.less
index f2cdb47f3..c4e762dcd 100644
--- a/src/contact-list/index.less
+++ b/src/contact-list/index.less
@@ -10,7 +10,7 @@
   }
 
   &__item-value {
-    padding-right: 34px;
+    padding-right: @padding-xl;
   }
 
   &__group {
@@ -29,7 +29,7 @@
   &__edit {
     position: absolute;
     top: 50%;
-    right: 15px;
+    right: @padding-md;
     font-size: @contact-list-edit-icon-size;
     transform: translate(0, -50%);
   }
diff --git a/src/style/var.less b/src/style/var.less
index aac91a85f..4285f1e7f 100644
--- a/src/style/var.less
+++ b/src/style/var.less
@@ -96,7 +96,7 @@
 @button-disabled-opacity: .5;
 
 // Card
-@card-padding: 5px 15px;
+@card-padding: @padding-xs @padding-md;
 @card-font-size: 12px;
 @card-text-color: @text-color;
 @card-background-color: @background-color-light;
@@ -112,7 +112,7 @@
 @cell-font-size: 14px;
 @cell-line-height: 24px;
 @cell-vertical-padding: 10px;
-@cell-horizontal-padding: 15px;
+@cell-horizontal-padding: @padding-md;
 @cell-text-color: @text-color;
 @cell-background-color: @white;
 @cell-border-color: @border-color;
@@ -125,14 +125,14 @@
 @cell-value-color: @gray-dark;
 @cell-icon-size: 16px;
 @cell-right-icon-color: @gray-dark;
-@cell-large-vertical-padding: 12px;
+@cell-large-vertical-padding: @padding-sm;
 @cell-large-title-font-size: 16px;
 @cell-large-label-font-size: 14px;
 
 // CellGroup
 @cell-group-background-color: @white;
 @cell-group-title-color: @gray-dark;
-@cell-group-title-padding: 15px 15px 5px;
+@cell-group-title-padding: @padding-md @padding-md @padding-xs;
 @cell-group-title-font-size: 14px;
 @cell-group-title-line-height: 16px;
 
@@ -140,7 +140,7 @@
 @checkbox-size: 20px;
 @checkbox-border-color: @gray-light;
 @checkbox-transition-duration: .2s;
-@checkbox-label-margin: 10px;
+@checkbox-label-margin: @padding-xs;
 @checkbox-label-color: @text-color;
 @checkbox-checked-icon-color: @blue;
 @checkbox-disabled-icon-color: @gray;
@@ -152,7 +152,7 @@
 
 // Collapse
 @collapse-item-transition-duration: .3s;
-@collapse-item-content-padding: 15px;
+@collapse-item-content-padding: @padding-md;
 @collapse-item-content-font-size: 13px;
 @collapse-item-content-line-height: 1.5;
 @collapse-item-content-text-color: @gray-dark;
@@ -160,20 +160,20 @@
 @collapse-item-title-disabled-color: @gray;
 
 // ContactCard
-@contact-card-padding: 15px;
+@contact-card-padding: @padding-md;
 @contact-card-add-icon-size: 40px;
 @contact-card-add-icon-color: @blue;
 @contact-card-value-line-height: 20px;
 
 // ContactEdit
-@contact-edit-buttons-padding: 30px 15px;
-@contact-edit-button-margin-bottom: 15px;
+@contact-edit-buttons-padding: @padding-xl @padding-md;
+@contact-edit-button-margin-bottom: @padding-md;
 @contact-edit-field-label-width: 65px;
 
 // ContactList
 @contact-list-edit-icon-size: 16px;
 @contact-list-add-button-z-index: 9999;
-@contact-list-item-padding: 15px;
+@contact-list-item-padding: @padding-md;
 
 // CountDown
 @count-down-text-color: @text-color;
@@ -181,9 +181,9 @@
 @count-down-line-height: 20px;
 
 // Coupon
-@coupon-margin: 0 15px 15px;
+@coupon-margin: 0 @padding-md @padding-md;
 @coupon-content-height: 100px;
-@coupon-content-padding: 24px 0 0 15px;
+@coupon-content-padding: @padding-lg 0 0 @padding-md;
 @coupon-background-color: @white;
 @coupon-active-background-color: @active-color;
 @coupon-border-radius: 4px;
@@ -194,7 +194,7 @@
 @coupon-currency-font-size: 50%;
 @coupon-name-font-size: 16px;
 @coupon-disabled-text-color: @gray-dark;
-@coupon-description-padding: 7px 15px;
+@coupon-description-padding: @padding-xs @padding-md;
 @coupon-description-background-color: @background-color-light;
 @coupon-description-border-color: @border-color;
 
@@ -203,7 +203,7 @@
 
 // CouponList
 @coupon-list-background-color: @background-color;
-@coupon-list-field-padding: 7px 15px;
+@coupon-list-field-padding: @padding-xs @padding-md;
 @coupon-list-exchange-button-height: 32px;
 @coupon-list-empty-image-size: 200px;
 @coupon-list-empty-tip-color: @gray-dark;
@@ -218,23 +218,23 @@
 @dialog-background-color: @white;
 @dialog-header-font-weight: 500;
 @dialog-header-line-height: 24px;
-@dialog-header-padding-top: 25px;
-@dialog-header-isolated-padding: 25px 0;
-@dialog-message-padding: 25px;
+@dialog-header-padding-top: @padding-lg;
+@dialog-header-isolated-padding: @padding-lg 0;
+@dialog-message-padding: @padding-lg;
 @dialog-message-font-size: 14px;
 @dialog-message-line-height: 20px;
 @dialog-message-max-height: 60vh;
 @dialog-has-title-message-text-color: @gray-darker;
-@dialog-has-title-message-padding-top: 12px;
+@dialog-has-title-message-padding-top: @padding-sm;
 @dialog-confirm-button-text-color: @blue;
 
 // Divider
-@divider-margin: 15px 0;
+@divider-margin: @padding-md 0;
 @divider-text-color: @gray-dark;
 @divider-font-size: 14px;
 @divider-line-height: 24px;
 @divider-border-color: @border-color;
-@divider-content-padding: 15px;
+@divider-content-padding: @padding-md;
 @divider-content-left-width: 10%;
 @divider-content-right-width: 10%;
 
@@ -258,7 +258,7 @@
 @field-text-area-min-height: 60px;
 
 // GridItem
-@grid-item-content-padding: 15px 10px;
+@grid-item-content-padding: @padding-md @padding-xs;
 @grid-item-content-background-color: @white;
 @grid-item-content-active-color: @active-color;
 @grid-item-icon-size: 28px;
@@ -276,7 +276,7 @@
 @goods-action-icon-text-color: @gray-darker;
 
 // IndexAnchor
-@index-anchor-padding: 0 15px;
+@index-anchor-padding: 0 @padding-md;
 @index-anchor-text-color: @text-color;
 @index-anchor-font-weight: 500;
 @index-anchor-font-size: 14px;
@@ -329,8 +329,8 @@
 
 // NoticeBar
 @notice-bar-height: 40px;
-@notice-bar-padding: 0 15px;
-@notice-bar-wrapable-padding: 8px 15px;
+@notice-bar-padding: 0 @padding-md;
+@notice-bar-wrapable-padding: @padding-xs @padding-md;
 @notice-bar-text-color: @orange-dark;
 @notice-bar-font-size: 14px;
 @notice-bar-line-height: 24px;
@@ -339,7 +339,7 @@
 @notice-bar-icon-min-width: 22px;
 
 // Notify
-@notify-padding: 6px 15px;
+@notify-padding: @padding-xs @padding-md;
 @notify-font-size: 14px;
 @notify-line-height: 20px;
 
@@ -353,7 +353,7 @@
 @number-keyboard-title-color: @gray-darker;
 @number-keyboard-title-height: 30px;
 @number-keyboard-title-font-size: 14px;
-@number-keyboard-close-padding: 0 15px;
+@number-keyboard-close-padding: 0 @padding-md;
 @number-keyboard-close-color: @blue;
 @number-keyboard-close-font-size: 14px;
 @number-keyboard-button-text-color: @white;
@@ -376,11 +376,11 @@
 // Panel
 @panel-background-color: @white;
 @panel-header-value-color: @red;
-@panel-footer-padding: 10px 15px;
+@panel-footer-padding: @padding-xs @padding-md;
 
 // PasswordInput
 @password-input-height: 50px;
-@password-input-margin: 0 15px;
+@password-input-margin: 0 @padding-md;
 @password-input-font-size: 20px;
 @password-input-border-radius: 6px;
 @password-input-background-color: @white;
@@ -394,7 +394,7 @@
 @picker-background-color: @white;
 @picker-toolbar-height: 44px;
 @picker-title-font-size: 16px;
-@picker-action-padding: 0 15px;
+@picker-action-padding: 0 @padding-md;
 @picker-action-font-size: 14px;
 @picker-action-text-color: @blue;
 @picker-action-active-color: @active-color;
@@ -424,7 +424,7 @@
 @radio-size: 20px;
 @radio-border-color: @gray-light;
 @radio-transition-duration: .2s;
-@radio-label-margin: 10px;
+@radio-label-margin: @padding-xs;
 @radio-label-color: @text-color;
 @radio-checked-icon-color: @blue;
 @radio-disabled-icon-color: @gray;
@@ -436,14 +436,14 @@
 @rate-icon-gutter: 4px;
 
 // Search
-@search-padding: 10px 16px;
+@search-padding: 10px @padding-sm;
 @search-background-color: #f7f8fA;
 @search-input-height: 34px;
 @search-label-padding: 0 5px;
 @search-label-color: @text-color;
 @search-label-font-size: 14px;
 @search-left-icon-color: @gray-dark;
-@search-action-padding: 0 10px;
+@search-action-padding: 0 @padding-xs;
 @search-action-text-color: @text-color;
 @search-action-font-size: 14px;
 
@@ -454,7 +454,7 @@
 @sidebar-font-size: 14px;
 @sidebar-line-height: 1.4;
 @sidebar-text-color: @gray-darker;
-@sidebar-padding: 20px 12px 20px 9px;
+@sidebar-padding: 20px @padding-sm 20px @padding-xs;
 @sidebar-active-color: @active-color;
 @sidebar-background-color: @background-color;
 @sidebar-selected-font-weight: 500;
@@ -465,7 +465,7 @@
 // Skeleton
 @skeleton-row-height: 16px;
 @skeleton-row-background-color: @active-color;
-@skeleton-row-margin-top: 12px;
+@skeleton-row-margin-top: @padding-sm;
 @skeleton-avatar-background-color: @active-color;
 @skeleton-animation-duration: 1.2s;
 
@@ -521,7 +521,7 @@
 @submit-bar-currency-font-size: 14px;
 @submit-bar-text-color: @text-color;
 @submit-bar-text-font-size: 14px;
-@submit-bar-tip-padding: 10px;
+@submit-bar-tip-padding: @padding-xs @padding-sm;
 @submit-bar-tip-font-size: 12px;
 @submit-bar-tip-line-height: 1.5;
 @submit-bar-tip-color: #f56723;
@@ -530,7 +530,7 @@
 
 // Swipe
 @swipe-indicator-size: 6px;
-@swipe-indicator-margin: 10px;
+@swipe-indicator-margin: @padding-sm;
 @swipe-indicator-active-opacity: 1;
 @swipe-indicator-inactive-opacity: .3;
 @swipe-indicator-active-background-color: @blue;
@@ -551,7 +551,7 @@
 
 // SwitchCell
 @switch-cell-padding-top: @cell-vertical-padding - 1px;
-@switch-cell-padding-bottom: @cell-vertical-padding -1px;
+@switch-cell-padding-bottom: @cell-vertical-padding - 1px;
 @switch-cell-large-padding-top: @cell-large-vertical-padding - 1px;
 @switch-cell-large-padding-bottom: @cell-large-vertical-padding - 1px;
 
@@ -604,8 +604,8 @@
 @toast-background-color: rgba(@text-color, .88);
 @toast-icon-size: 40px;
 @toast-text-min-width: 96px;
-@toast-text-padding: 8px 12px;
-@toast-default-padding: 15px;
+@toast-text-padding: @padding-xs @padding-sm;
+@toast-default-padding: @padding-md;
 @toast-default-width: 90px;
 @toast-default-min-height: 90px;
 @toast-position-top-distance: 50px;
@@ -615,7 +615,7 @@
 @tree-select-font-size: 14px;
 @tree-select-nav-background-color: @background-color-light;
 @tree-select-content-background-color: @white;
-@tree-select-nav-item-padding: 0 9px 0 12px;
+@tree-select-nav-item-padding: 0 @padding-xs 0 @padding-sm;
 @tree-select-nav-item-active-border-color: @red;
 @tree-select-nav-item-active-background-color: @white;
 @tree-select-nav-item-disabled-color: @gray-dark;