diff --git a/examples/routers/circle.vue b/examples/routers/circle.vue
index 4ef87786..c71a1e9d 100644
--- a/examples/routers/circle.vue
+++ b/examples/routers/circle.vue
@@ -1,44 +1,20 @@
 <template>
     <div>
-        <i-circle :percent="percent" dashboard :stroke-color="color">
-            <Icon v-if="percent == 100" type="ios-checkmark" size="60" style="color:#5cb85c"></Icon>
-            <span v-else style="font-size:24px">{{ percent }}%</span>
+        <i-circle :percent="80">
+            <span class="demo-i-circle-inner" style="font-size:24px">80%</span>
+        </i-circle>
+        <i-circle :percent="100" stroke-color="#5cb85c">
+            <Icon type="ios-checkmark" size="60" style="color:#5cb85c"></Icon>
+        </i-circle>
+        <i-circle :percent="35" stroke-color="#ff5500">
+        <span class="demo-i-circle-inner">
+            <Icon type="ios-close" size="50" style="color:#ff5500"></Icon>
+        </span>
         </i-circle>
-        <ButtonGroup size="large">
-            <Button icon="ios-add" @click="add"></Button>
-            <Button icon="ios-remove" @click="minus"></Button>
-        </ButtonGroup>
     </div>
 </template>
 <script>
     export default {
-        data () {
-            return {
-                percent: 0
-            }
-        },
-        computed: {
-            color () {
-                let color = '#2db7f5';
-                if (this.percent == 100) {
-                    color = '#5cb85c';
-                }
-                return color;
-            }
-        },
-        methods: {
-            add () {
-                if (this.percent >= 100) {
-                    return false;
-                }
-                this.percent += 10;
-            },
-            minus () {
-                if (this.percent <= 0) {
-                    return false;
-                }
-                this.percent -= 10;
-            }
-        }
+
     }
 </script>
diff --git a/src/components/circle/circle.vue b/src/components/circle/circle.vue
index 52cbe952..762984a7 100644
--- a/src/components/circle/circle.vue
+++ b/src/components/circle/circle.vue
@@ -31,7 +31,7 @@
             },
             strokeColor: {
                 type: String,
-                default: '#2db7f5'
+                default: '#2d8cf0'
             },
             strokeLinecap: {
                 validator (value) {