color image

@@ -6,7 +6,8 @@
                 disabled: color.disabled
             }">
             <div class="color-border">
-                <i :style="{ 'background-color': '#' + (color.colorCode || 'ffffff')}" :title="color.colorName"></i>
+                <i v-if="color.colorValue" class="color-image" :style="{ 'background-image': `url(${color.colorValue})`}" :title="color.colorName"></i>
+                <i v-else :style="{ 'background-color': '#' + (color.colorCode || 'ffffff')}" :title="color.colorName"></i>
             </div>
             <span>{{color.colorName}}</span>
         </div>
@@ -124,6 +125,10 @@ export default {
             overflow: hidden;
         }
 
+        .color-image {
+            background-size: cover;
+        }
+
         i {
             display: block;
             width: 30px;