diff --git a/app/components/eye-icon.coffee b/app/components/eye-icon.coffee
new file mode 100644
index 00000000..91740fd1
--- /dev/null
+++ b/app/components/eye-icon.coffee
@@ -0,0 +1,8 @@
+`import Ember from 'ember'`
+
+EyeIconComponent = Ember.Component.extend
+
+  tagName: 'span'
+  classNames: ['icon-eye']
+
+`export default EyeIconComponent`
diff --git a/app/templates/components/eye-icon.hbs b/app/templates/components/eye-icon.hbs
new file mode 100644
index 00000000..60422428
--- /dev/null
+++ b/app/templates/components/eye-icon.hbs
@@ -0,0 +1,8 @@
+<svg x="0px" y="0px" viewBox="2 -1 17 17" width="20" height="18" xml:space="preserve">
+  <g>
+    <path  d="M17.4,9.6c-0.1-0.2-3.3-4.1-7.4-4.1s-7.3,4-7.4,4.1c-0.2,0.2-0.2,0.6,0,0.8c0.1,0.2,3.3,4.1,7.4,4.1
+      s7.3-4,7.4-4.1C17.6,10.2,17.6,9.8,17.4,9.6z M10,13.2c-2.8,0-5.2-2.3-6.1-3.2C4.8,9.1,7.2,6.8,10,6.8c2.8,0,5.2,2.3,6.1,3.2
+      C15.2,10.9,12.8,13.2,10,13.2z"/>
+    <circle r="2.5" cx="10" cy="10"/>
+  </g>
+</svg>
diff --git a/app/templates/profile/accounts.hbs b/app/templates/profile/accounts.hbs
index 1dddcf0e..b4c4124e 100644
--- a/app/templates/profile/accounts.hbs
+++ b/app/templates/profile/accounts.hbs
@@ -18,16 +18,8 @@
           <span class="tooltip-bubble">
             {{#if isVisible}}hide token{{else}}show token{{/if}}
           </span>
-          <span class="icon-eye">
-            <svg x="0px" y="0px" viewBox="2 -1 17 17" width="20" height="18" xml:space="preserve">
-              <g>
-                <path  d="M17.4,9.6c-0.1-0.2-3.3-4.1-7.4-4.1s-7.3,4-7.4,4.1c-0.2,0.2-0.2,0.6,0,0.8c0.1,0.2,3.3,4.1,7.4,4.1
-                  s7.3-4,7.4-4.1C17.6,10.2,17.6,9.8,17.4,9.6z M10,13.2c-2.8,0-5.2-2.3-6.1-3.2C4.8,9.1,7.2,6.8,10,6.8c2.8,0,5.2,2.3,6.1,3.2
-                  C15.2,10.9,12.8,13.2,10,13.2z"/>
-                <circle r="2.5" cx="10" cy="10"/>
-              </g>
-            </svg>
-          </span></a>
+          {{eye-icon}}
+          </a>
         </p>
       </div>
     </div>