diff --git a/src/pages/demo/element/basic-color/components/info.vue b/src/pages/demo/element/basic-color/components/info.vue
index c0e7cfbc..1f33a070 100644
--- a/src/pages/demo/element/basic-color/components/info.vue
+++ b/src/pages/demo/element/basic-color/components/info.vue
@@ -1,8 +1,8 @@
 <template>
   <div class="info" :class="theme">
-    <p>颜色名称</p>
-    <p>scss名称</p>
-    <p>颜色值</p>
+    <p>{{name}}</p>
+    <p>{{sass}}</p>
+    <p>{{color}}</p>
   </div>
 </template>
 
@@ -13,6 +13,21 @@ export default {
       type: String,
       required: false,
       default: 'light' // dark
+    },
+    name: {
+      type: String,
+      required: false,
+      default: ''
+    },
+    sass: {
+      type: String,
+      required: false,
+      default: ''
+    },
+    color: {
+      type: String,
+      required: false,
+      default: ''
     }
   }
 }
diff --git a/src/pages/demo/element/basic-color/index.vue b/src/pages/demo/element/basic-color/index.vue
index 6387f87b..03d40bbf 100644
--- a/src/pages/demo/element/basic-color/index.vue
+++ b/src/pages/demo/element/basic-color/index.vue
@@ -5,7 +5,7 @@
       <el-row :gutter="20">
         <el-col :span="6">
           <div class="color color-primary">
-            <d2-element-basic-color-info/>
+            <d2-element-basic-color-info name="Blue" sass="$color-primary" color="#409EFF"/>
           </div>
         </el-col>
       </el-row>