diff --git a/src/components/segmented/segmented.patch.less b/src/components/segmented/segmented.patch.less
new file mode 100644
index 0000000000..f86575065e
--- /dev/null
+++ b/src/components/segmented/segmented.patch.less
@@ -0,0 +1,48 @@
+@class-prefix-segmented: ~'adm-segmented';
+
+.@{class-prefix-segmented} {
+  color: #666;
+  background-color: #f5f5f5;
+  transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
+
+  &-item {
+    transition: color 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
+
+    &-selected {
+      .segmented-item-selected();
+      color: #333;
+    }
+  }
+
+  // disabled styles
+  &-item-disabled {
+    .segmented-disabled-item();
+  }
+
+  // thumb styles
+  &-thumb {
+    .segmented-item-selected();
+  }
+
+  // transition effect when `appear-active`
+  &-thumb-motion-appear-active {
+    transition:
+      transform 0.3s cubic-bezier(0.645, 0.045, 0.355, 1),
+      width 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
+  }
+}
+
+/* ---- mixins part starts ---- */
+.segmented-disabled-item {
+  color: #999;
+}
+
+.segmented-item-selected {
+  background-color: #fff;
+  box-shadow:
+    0 2px 8px -2px fade(#000, 5%),
+    0 1px 4px -1px fade(#000, 7%),
+    0 0 1px 0 fade(#000, 8%);
+}
+
+/* ---- mixins part ends ---- */
diff --git a/src/global/css-vars-patch.less b/src/global/css-vars-patch.less
index f3ca619a82..117f59e916 100644
--- a/src/global/css-vars-patch.less
+++ b/src/global/css-vars-patch.less
@@ -11,6 +11,7 @@
   @import '../components/popover/popover.patch.less';
   @import '../components/scroll-mask/scroll-mask.patch.less';
   @import '../components/space/space.patch.less';
+  @import '../components/segmented/segmented.patch.less';
   @import '../components/spin-loading/spin-loading.patch.less';
   @import '../components/swiper/swiper.patch.less';
   @import '../components/tabs/tabs.patch.less';