diff --git a/src/components/icon/icon.vue b/src/components/icon/icon.vue
index 62561cb..d79c030 100644
--- a/src/components/icon/icon.vue
+++ b/src/components/icon/icon.vue
@@ -7,20 +7,25 @@
     export default {
         props: {
             type: String,
-            size: [Number, String]
+            size: [Number, String],
+            color: String
         },
         computed: {
             classes () {
                 return `${prefixCls} ${prefixCls}-${this.type}`
             },
             styles () {
+                let style = {};
+
                 if (!!this.size) {
-                    return {
-                        'font-size': `${this.size}px`
-                    }
-                } else {
-                    return {}
+                    style['font-size'] = `${this.size}px`;
+                }
+
+                if (!!this.color) {
+                    style.color = this.color;
                 }
+
+                return style;
             }
         }
     }
diff --git a/test/routers/slider.vue b/test/routers/slider.vue
index 6e5d97c..8b05727 100644
--- a/test/routers/slider.vue
+++ b/test/routers/slider.vue
@@ -7,12 +7,13 @@
         <!--<Slider :max="10"></Slider>-->
         <!--<Slider :step="13"></Slider>-->
         <!--<Slider :step="13" :max="60"></Slider>-->
+        <Icon type="checkmark-circled" size="40" color="#f60"></Icon>
     </div>
 </template>
 <script>
-    import { Slider } from 'iview';
+    import { Slider, Icon } from 'iview';
     export default {
-        components: { Slider },
+        components: { Slider, Icon },
         data () {
             return {
                 value: [20, 50]
--
libgit2 0.21.4