替换字体图标

 <label class="round-color{{#if cur}} cur{{/if}}" title="{{title}}" data-color="{{color}}" data-color="{{total}}" style="background: #f00{{rgb}}">
-    <span class="color-cover"></span>
+    <span class="iconfont icon-cover">&#xe61b;</span>
+    <span class="iconfont icon-round">&#xe620;</span>
 </label>
\ No newline at end of file

@@ -2,7 +2,7 @@
 <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd" >
 <svg xmlns="http://www.w3.org/2000/svg">
 <metadata>
-Created by FontForge 20120731 at Mon Jul  4 16:04:45 2016
+Created by FontForge 20120731 at Tue Jul  5 16:22:47 2016
  By admin
 </metadata>
 <defs>
@@ -19,7 +19,7 @@ Created by FontForge 20120731 at Mon Jul  4 16:04:45 2016
     bbox="0 -212 1303 896.303"
     underline-thickness="50"
     underline-position="-100"
-    unicode-range="U+0078-E61C"
+    unicode-range="U+0078-E620"
   />
 <missing-glyph horiz-adv-x="374" 
 d="M34 0v682h272v-682h-272zM68 34h204v614h-204v-614z" />
@@ -50,9 +50,10 @@ t-186.5 186.5t-257 68.5z" />
 d="M968 -37l-163 164q69 108 69 234q0 119 -57.5 219t-157 158.5t-216 58.5t-216 -58.5t-157 -158.5t-57.5 -218.5t57.5 -219t157 -158.5t216.5 -58q124 0 231 69l163 -164q27 -28 65 -28t65 27.5t27 66t-27 66.5zM443.5 50q-127.5 0 -217.5 91.5t-90 220t90 219.5t217.5 91
 t217.5 -91t90 -219.5t-90 -220t-217.5 -91.5z" />
     <glyph glyph-name="uniE606" unicode="&#xe606;" 
-d="M387 158l45 -46l272 272l-272 272l-45 -46l226 -226z" />
+d="M512 841q-94 0 -179.5 -37t-147.5 -99t-98.5 -147.5t-36.5 -179.5t36.5 -179.5t98.5 -147.5t147.5 -98.5t179.5 -36.5t179.5 36.5t147.5 98.5t98.5 147.5t36.5 179.5t-36.5 179.5t-98.5 147.5t-147.5 99t-179.5 37zM512 -33q-112 0 -206.5 55t-150 150t-55.5 206.5
+t55.5 206.5t150 150t206.5 55t206.5 -55t150 -150t55.5 -206.5t-55.5 -206.5t-150 -150t-206.5 -55zM522 680h-51v-352h5l296 -120l19 47l-269 109v316z" />
     <glyph glyph-name="uniE607" unicode="&#xe607;" 
-d="M704 665l-41 39l-343 -320l343 -320l41 39l-301 281z" />
+d="M770 83l-49 -49l-337 335l337 335l49 -50l-284 -285z" />
     <glyph glyph-name="uniE608" unicode="&#xe608;" 
 d="M959 -62l-85 -85l-362 362l-362 -362l-85 85l362 362l-362 362l85 85l362 -362l362 362l85 -85l-362 -362z" />
     <glyph glyph-name="uniE609" unicode="&#xe609;" 
@@ -105,10 +106,16 @@ d="M1303 538l-161 242h-304v-443h233q19 0 32.5 14t13.5 33t-13.5 33t-32.5 14h-140v
 q0 56 -31 105h363q-30 -49 -30 -105q0 -82 58 -140t140 -58t140 58t58 140q0 56 -31 105h77v363zM93 803h582v-535h-582v535zM465 70q0 -43 -30.5 -74t-74 -31t-74 31t-30.5 74t30.5 74t74 31t74 -31t30.5 -74zM1164 70q0 -43 -31 -74t-74 -31t-74 31t-31 74t31 74t74 31
 t74 -31t31 -74z" />
     <glyph glyph-name="uniE61B" unicode="&#xe61b;" 
-d="M512 -212q-104 0 -199 40.5t-163.5 109t-109 163.5t-40.5 199t40.5 199t109 163.5t163.5 109t199 40.5t199 -40.5t163.5 -109t109 -163.5t40.5 -199t-40.5 -199t-109 -163.5t-163.5 -109t-199 -40.5zM512 747q-91 0 -173.5 -35.5t-142.5 -95.5t-95.5 -142.5t-35.5 -173.5
-t35.5 -173.5t95.5 -142.5t142.5 -95.5t173.5 -35.5t173.5 35.5t142.5 95.5t95.5 142.5t35.5 173.5t-35.5 173.5t-95.5 142.5t-142.5 95.5t-173.5 35.5zM482 267l-1 351h63v-319l198 -166l-39 -55z" />
+d="M0 -128v1024h1024v-1024h-1024zM512 704q-133 0 -226.5 -93.5t-93.5 -226.5t93.5 -226.5t226.5 -93.5t226.5 93.5t93.5 226.5t-93.5 226.5t-226.5 93.5z" />
     <glyph glyph-name="uniE61C" unicode="&#xe61c;" horiz-adv-x="1093" 
 d="M1092 225v171q0 101 -39.5 193.5t-106.5 159.5t-160 107t-194 40h-92q-101 0 -193.5 -40t-159.5 -107t-107 -159.5t-40 -193.5v-173v-317q0 -14 10 -24t24 -10h175q15 0 24.5 10t9.5 24v317q0 15 -9.5 24.5t-24.5 9.5h-128v116q0 88 34 168t92 137.5t138 92t168 34.5h67
 q87 0 167 -34.5t138 -92t92 -137.5t34 -168v-113h-129q-15 0 -24.5 -10t-9.5 -25v-317q0 -14 9.5 -24t24.5 -10h175q14 0 24 10t10 24z" />
+    <glyph glyph-name="uniE61D" unicode="&#xe61d;" 
+d="M649 543l-137 -136l-137 136l-22 -22l136 -137l-136 -137l22 -22l137 136l137 -136l22 22l-136 137l136 137z" />
+    <glyph glyph-name="uniE61E" unicode="&#xe61e;" 
+d="M384 570l48 50l338 -335l-338 -335l-48 49l284 286z" />
+    <glyph glyph-name="uniE620" unicode="&#xe620;" 
+d="M512 886q-102 0 -195 -39.5t-160.5 -107t-107 -160.5t-39.5 -195t39.5 -195t107 -160.5t160.5 -107t195 -39.5t195 39.5t160.5 107t107 160.5t39.5 195t-39.5 195t-107 160.5t-160.5 107t-195 39.5zM512 -79q-94 0 -180 36.5t-148 98.5t-98.5 148t-36.5 180t36.5 180
+t98.5 148t148 98.5t180 36.5t180 -36.5t148 -98.5t98.5 -148t36.5 -180t-36.5 -180t-98.5 -148t-148 -98.5t-180 -36.5z" />
   </font>
 </defs></svg>

 .round-color {
-    width: 32px;
-    height: 32px;
+    width: 30px;
+    height: 30px;
+    text-align: center;
     display: inline-block;
     cursor: pointer;
+    position: relative;
 
-    .color-cover {
-        width: 100%;
-        height: 100%;
-        display: block;
-        background: resolve('components/color-cover.png') no-repeat center center;
+    .iconfont {
+        font-size: 30px;
     }
 
-    &.cur .color-cover {
-        background: resolve('components/color-cover-cur.png') no-repeat center center;
+    .icon-cover {
+        color: #fff;
+    }
+
+    .icon-round {
+        color: #eee;
+        top: 0;
+        left: 0;
+        position: absolute;
+    }
+
+    &.cur .icon-round {
+        color: #1d1d1d;
+        font-weight: bold;
     }
 }