diff --git a/components/steps/index.jsx b/components/steps/index.jsx
index 64361e183f..bc100e863c 100644
--- a/components/steps/index.jsx
+++ b/components/steps/index.jsx
@@ -1,3 +1,21 @@
 'use strict';
 
-module.exports = require('rc-steps');
+var React = require('react');
+var Steps = require('rc-steps');
+
+var AntSteps = React.createClass({
+  getDefaultProps() {
+    return {
+      prefixCls: 'ant',
+      size: 'default'
+    };
+  },
+  render() {
+    return (<Steps size={this.props.size} prefixCls={this.props.prefixCls}>
+      {this.props.children}
+    </Steps>);
+  }
+});
+AntSteps.Step = Steps.Step;
+
+module.exports = AntSteps;
diff --git a/package.json b/package.json
index d2d6b14a76..8c85ff3cb2 100644
--- a/package.json
+++ b/package.json
@@ -22,7 +22,7 @@
     "rc-select": "~4.0.0",
     "rc-tabs": "~5.1.0",
     "rc-tooltip": "~2.1.1",
-    "rc-steps": "~1.0.2"
+    "rc-steps": "~1.0.3"
   },
   "devDependencies": {
     "babel-core": "~5.4.7",
diff --git a/style/components/steps.less b/style/components/steps.less
index 87a6c257a5..31e3014094 100644
--- a/style/components/steps.less
+++ b/style/components/steps.less
@@ -1,3 +1,6 @@
+@import "../mixins/index";
+@stepsPrefixClass: ~"@{css-prefix}steps";
+
 @active-color: #3fc7fa;
 @wait-color: #e9e9e9;
 
@@ -7,52 +10,52 @@
   transition: @transition;
 }
 
-.rc-steps {
+.@{stepsPrefixClass} {
   font-size: 0;
   width: 100%;
   line-height: 1.5;
 
-  .rc-steps-item {
+  .@{stepsPrefixClass}-item {
     position: relative;
     display: inline-block;
 
-    &.rc-steps-status-wait {
-      .rc-steps-head {
+    &.@{stepsPrefixClass}-status-wait {
+      .@{stepsPrefixClass}-head {
         border-color: @wait-color;
         background-color: #fff;
 
-        > .rc-steps-icon {
+        > .@{stepsPrefixClass}-icon {
           color: @wait-color;
         }
       }
     }
-    &.rc-steps-status-process {
-      .rc-steps-head {
+    &.@{stepsPrefixClass}-status-process {
+      .@{stepsPrefixClass}-head {
         border-color: @active-color;
         background-color: @active-color;
 
-        > .rc-steps-icon {
+        > .@{stepsPrefixClass}-icon {
           color: #fff;
         }
       }
     }
-    &.rc-steps-status-finish {
-      .rc-steps-head {
+    &.@{stepsPrefixClass}-status-finish {
+      .@{stepsPrefixClass}-head {
         border-color: @active-color;
         background-color: #fff;
-        > .rc-steps-icon {
+        > .@{stepsPrefixClass}-icon {
           color: @active-color;
         }
       }
     }
 
-    &.rc-steps-custom {
-      .rc-steps-head {
+    &.@{stepsPrefixClass}-custom {
+      .@{stepsPrefixClass}-head {
         background: none;
         border: 0;
       }
-      &.rc-steps-status-process {
-        .rc-steps-title {
+      &.@{stepsPrefixClass}-status-process {
+        .@{stepsPrefixClass}-title {
           color: @active-color;
         }
       }
@@ -60,12 +63,12 @@
 
   }
 
-  .rc-steps-head, .rc-steps-main, .rc-steps-tail {
+  .@{stepsPrefixClass}-head, .@{stepsPrefixClass}-main, .@{stepsPrefixClass}-tail {
     display: inline-block;
     vertical-align: top;
 
   }
-  .rc-steps-head {
+  .@{stepsPrefixClass}-head {
     border:2px solid @wait-color;
     width: 24px;
     height: 24px;
@@ -77,7 +80,7 @@
     .transition(background-color 0.1s ease);
     .transition(border-color 0.1s ease);
 
-    > .rc-steps-icon {
+    > .@{stepsPrefixClass}-icon {
       line-height: 1;
       display: inline-block;
       vertical-align: text-top;
@@ -85,21 +88,21 @@
       position: relative;
     }
   }
-  .rc-steps-main {
+  .@{stepsPrefixClass}-main {
     max-width: 75