diff --git a/script/icomoon.js b/script/icomoon.js
index b5412dd..a539469 100644
--- a/script/icomoon.js
+++ b/script/icomoon.js
@@ -1,4 +1,4 @@
-// Icons: info, blocked, terminal, bin, loop
+// Icons(Font-awesome): times-circle, exclamation-triangle, chevron-left, chevron-right, repeat, trash, cog, ban, info-circle
 
 var fs = require('fs'),
     path = require('path');
diff --git a/src/Console/Console.hbs b/src/Console/Console.hbs
index 11558df..55d6d4a 100644
--- a/src/Console/Console.hbs
+++ b/src/Console/Console.hbs
@@ -1,11 +1,11 @@
 <div class="eruda-control">
-    <span class="eruda-icon-blocked clear-console" ontouchstart></span>
+    <span class="eruda-icon-ban clear-console" ontouchstart></span>
     <span class="eruda-filter filter eruda-active" data-filter="all">All</span>
     <span class="eruda-filter filter" data-filter="error">Error</span>
     <span class="eruda-filter filter" data-filter="warn">Warning</span>
     <span class="eruda-filter filter" data-filter="info">Info</span>
     <span class="eruda-filter filter" data-filter="log">Log</span>
-    <span class="eruda-icon-info help" ontouchstart></span>
+    <span class="eruda-icon-info-circle help" ontouchstart></span>
 </div>
 <div class="eruda-logs"></div>
 <div class="eruda-js-input">
diff --git a/src/Console/Console.scss b/src/Console/Console.scss
index 0e8dd77..189ef87 100644
--- a/src/Console/Console.scss
+++ b/src/Console/Console.scss
@@ -11,7 +11,7 @@
             height: 40px;
             line-height: 20px;
             width: 100%;
-            .icon-blocked, .icon-info {
+            .icon-ban, .icon-info-circle {
                 display: inline-block;
                 color: $gray;
                 padding: 5px;
@@ -22,10 +22,10 @@
                     color: $gray-light;
                 }
             }
-            .icon-blocked {
+            .icon-ban {
                 left: 10px;
             }
-            .icon-info {
+            .icon-info-circle {
                 right: 10px;
             }
             .filter {
@@ -66,9 +66,13 @@
                     width: 50%;
                     display: inline-block;
                     text-align: center;
+                    border-right: 1px solid $gray-light;
                     height: 40px;
                     line-height: 40px;
                     float: left;
+                    &:last-child {
+                        border-right: none;
+                    }
                     &:active {
                         background: $blue;
                         color: #fff;
diff --git a/src/Console/Log.es6 b/src/Console/Log.es6
index deb731f..48be503 100644
--- a/src/Console/Log.es6
+++ b/src/Console/Log.es6
@@ -52,6 +52,7 @@ export default class Log extends util.Emitter
             type: 'input',
             ignoreFilter: true,
             isCode: true,
+            icon: 'chevron-right',
             src,
             val: jsCode
         });
@@ -73,6 +74,7 @@ export default class Log extends util.Emitter
         this._insert({
             type: 'output',
             ignoreFilter: true,
+            icon: 'chevron-left',
             src,
             val: transMsg(val)
         });
@@ -120,25 +122,27 @@ export default class Log extends util.Emitter
     {
         if (util.isUndef(msg)) return;
 
-        var ignoreFilter = false, src;
+        var ignoreFilter = false;
 
         if (util.isErr(msg))
         {
-            src = {
-                stack: msg.stack,
-                message: msg.message || ''
-            };
             ignoreFilter = msg.ignoreFilter;
-            msg = errToStr(msg);
         } else
         {
-            msg = errToStr(new Error(), transMsg(msg));
+            msg = new Error(msg);
         }
 
+        var src = {
+            message: msg.message || '',
+            stack: msg.stack
+        };
+        msg = errToStr(msg);
+
         this._insert({
             type: 'error',
             ignoreFilter: ignoreFilter,
             src,
+            icon: 'times-circle',
             val: msg
         });
 
@@ -152,6 +156,7 @@ export default class Log extends util.Emitter
         this._insert({
             type: 'info',
             src,
+            icon: 'info-circle',
             val: msg
         });
 
@@ -165,6 +170,7 @@ export default class Log extends util.Emitter
         this._insert({
             type: 'warn',
             src,
+            icon: 'exclamation-triangle',
             val: msg
         });
 
@@ -328,11 +334,12 @@ function evalJs(jsInput)
     return eval.call(window, jsInput);
 }
 
-function errToStr(err, msg)
+function errToStr(err)
 {
     var lines = err.stack.split('\n');
 
-    if (util.isUndef(msg)) msg = lines[0] + '<br/>';
+    var msg = `${lines[0]}<br/>`;
+
     var stack = `<div class="eruda-stack">${lines.slice(1).join('<br/>')}</div>`;
 
     stack = stack.replace(regJsUrl, function (match)
diff --git a/src/Console/Log.hbs b/src/Console/Log.hbs
index 5a8b6b5..fd45736 100644
--- a/src/Console/Log.hbs
+++ b/src/Console/Log.hbs
@@ -1,6 +1,11 @@
 <ul>
     {{#each logs}}
         <li class="eruda-{{type}} eruda-log-item" data-idx="{{@index}}">
+            {{#if icon}}
+                <div class="eruda-icon-container">
+                    <span class="eruda-icon eruda-icon-{{icon}}"></span>
+                </div>
+            {{/if}}
             {{#if showTimes}}<div class="eruda-times">{{times}}</div>{{/if}}
             <div class="eruda-log-content-wrapper">
                 <div class="eruda-log-content">
diff --git a/src/Console/Log.scss b/src/Console/Log.scss
index cefd3c8..37a6967 100644
--- a/src/Console/Log.scss
+++ b/src/Console/Log.scss
@@ -17,19 +17,41 @@
             a {
                 color: $blue !important;
             }
-            .times {
-                background: $blue;
-                padding: 5px;
-                color: #fff;
-                border-radius: 4px;
+            .times, .icon-container {
                 float: left;
                 margin-right: 5px;
             }
+            .icon-container {
+                .icon {
+                    line-height: 20px;
+                    font-size: 12px;
+                    color: $gray-dark;
+                }
+                .icon-chevron-right {
+                    color: $blue;
+                }
+                .icon-info-circle {
+                    color: $blue;
+                }
+                .icon-times-circle {
+                    color: $red-dark;
+                }
+                .icon-exclamation-triangle {
+                    color: $yellow-dark;
+                }
+            }
+            .times {
+                background: $blue;
+                padding: 2px 4px;
+                color: #fff;
+                border-radius: 10px;
+            }
             .log-content-wrapper {
                 overflow: hidden;
             }
             .log-content
             {
+                line-height: 20px;
                 overflow-x: auto;
                 -webkit-overflow-scrolling: touch;
             }
@@ -74,6 +96,9 @@
             &.info {
                 color: $blue;
             }
+            &.output {
+                color: $gray-dark;
+            }
         }
     }
 } } }
\ No newline at end of file
diff --git a/src/Elements/Elements.scss b/src/Elements/Elements.scss
index 2f525b6..35970a2 100644
--- a/src/Elements/Elements.scss
+++ b/src/Elements/Elements.scss
@@ -108,7 +108,7 @@
             .btn {
                 text-align: center;
                 color: $gray;
-                font-size: 14px;
+                font-size: 12px;
                 line-height: 40px;
                 flex-grow: 1;
                 &:active, &.active {
diff --git a/src/EntryBtn/EntryBtn.hbs b/src/EntryBtn/EntryBtn.hbs
index 27e685d..0005c51 100644
--- a/src/EntryBtn/EntryBtn.hbs
+++ b/src/EntryBtn/EntryBtn.hbs
@@ -1,3 +1,3 @@
 <div class="eruda-home-btn" ontouchstart>
-    <span class="eruda-icon-terminal"></span>
+    <span class="eruda-icon-cog"></span>
 </div>
\ No newline at end of file
diff --git a/src/EntryBtn/EntryBtn.scss b/src/EntryBtn/EntryBtn.scss
index f7afbb7..edbc9d6 100644
--- a/src/EntryBtn/EntryBtn.scss
+++ b/src/EntryBtn/EntryBtn.scss
@@ -1,4 +1,3 @@
-
 .container { .home-btn {
     width: 40px;
     height: 40px;
diff --git a/src/Resources/Resources.hbs b/src/Resources/Resources.hbs
index 5039f34..c90aaf3 100644
--- a/src/Resources/Resources.hbs
+++ b/src/Resources/Resources.hbs
@@ -2,7 +2,7 @@
     <h2 class="eruda-title {{localStoreState}}">
         LocalStorage
         <div class="eruda-btn refresh-local-storage">
-            <span class="eruda-icon-loop"></span>
+            <span class="eruda-icon-repeat"></span>
         </div>
     </h2>
     <table>
@@ -13,7 +13,7 @@
                         <td class="eruda-key">{{key}}</td>
                         <td class="eruda-local-storage-val" data-key="{{key}}">{{val}}</td>
                         <td class="eruda-control">
-                            <span class="eruda-icon-bin delete-local-storage" data-key="{{key}}"></span>
+                            <span class="eruda-icon-trash delete-local-storage" data-key="{{key}}"></span>
                         </td>
                     </tr>
                 {{/each}}
@@ -29,7 +29,7 @@
     <h2 class="eruda-title {{cookieState}}">
         Cookie
         <div class="eruda-btn refresh-cookie">
-            <span class="eruda-icon-loop"></span>
+            <span class="eruda-icon-repeat"></span>
         </div>
     </h2>
     <table>
@@ -40,7 +40,7 @@
                         <td class="eruda-key">{{key}}</td>
                         <td>{{val}}</td>
                         <td class="eruda-control">
-                            <span class="eruda-icon-bin delete-cookie" data-key="{{key}}"></span>
+                            <span class="eruda-icon-trash delete-cookie" data-key="{{key}}"></span>
                         </td>
                     </tr>
                 {{/each}}
@@ -56,7 +56,7 @@
     <h2 class="eruda-title {{scriptState}}">
         Script
         <div class="eruda-btn refresh-script">
-            <span class="eruda-icon-loop"></span>
+            <span class="eruda-icon-repeat"></span>
         </div>
     </h2>
     <ul class="eruda-link-list">
@@ -75,7 +75,7 @@
     <h2 class="eruda-title {{stylesheetState}}">
         Stylesheet
         <div class="eruda-btn refresh-stylesheet">
-            <span class="eruda-icon-loop"></span>
+            <span class="eruda-icon-repeat"></span>
         </div>
     </h2>
     <ul class="eruda-link-list">
@@ -94,7 +94,7 @@
     <h2 class="eruda-title {{imageState}}">
         Image
         <div class="eruda-btn refresh-image">
-            <span class="eruda-icon-loop"></span>
+            <span class="eruda-icon-repeat"></span>
         </div>
     </h2>
     <ul class="eruda-image-list">
diff --git a/src/Resources/Resources.scss b/src/Resources/Resources.scss
index 7dcb382..574a480 100644
--- a/src/Resources/Resources.scss
+++ b/src/Resources/Resources.scss
@@ -39,10 +39,6 @@
                 border-radius: 50%;
                 font-size: 12px;
                 cursor: pointer;
-                .icon-loop {
-                    position: relative;
-                    top: 1px;
-                }
             }
         }
         .link-list {
@@ -82,7 +78,7 @@
             td {
                 padding: 10px;
                 word-break: break-all;
-                .icon-bin {
+                .icon-trash {
                     color: $red-dark;
                     display: inline-block;
                     padding: 5px;
diff --git a/src/icon.css b/src/icon.css
index 7e6906d..f1dfce7 100644
--- a/src/icon.css
+++ b/src/icon.css
@@ -1,6 +1,6 @@
 @font-face {
     font-family: 'icomoon';
-    src: url('data:application/x-font-woff;charset=utf-8;base64,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') format('woff');
+    src: url('data:application/x-font-woff;charset=utf-8;base64,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') format('woff');
     font-weight: normal;
     font-style: normal;
 }
@@ -20,19 +20,31 @@
     -moz-osx-font-smoothing: grayscale;
 }
 
-.icon-info:before {
+.icon-times-circle:before {
+    content: "\e908";
+}
+.icon-exclamation-triangle:before {
+    content: "\e907";
+}
+.icon-chevron-left:before {
+    content: "\e906";
+}
+.icon-chevron-right:before {
     content: "\e904";
 }
-.icon-blocked:before {
-    content: "\e903";
+.icon-repeat:before {
+    content: "\e905";
 }
-.icon-terminal:before {
-    content: "\e901";
-}
-.icon-bin:before {
-    content: "\e902";
-}
-.icon-loop:before {
+.icon-trash:before {
     content: "\e900";
 }
+.icon-cog:before {
+    content: "\e901";
+}
+.icon-ban:before {
+    content: "\e902";
+}
+.icon-info-circle:before {
+    content: "\e903";
+}
 
diff --git a/src/variable.scss b/src/variable.scss
index 4dfcde8..d7ef3eb 100644
--- a/src/variable.scss
+++ b/src/variable.scss
@@ -4,7 +4,9 @@ $common-padding: 10px;
 $blue: #76a2ee;
 $gray: #b4b4b4;
 $gray-light: #f2f2f2;
+$gray-dark: #888;
 $red: #eda29b;
 $red-dark: #f73c37;
 $green: #8de191;
-$yellow: #fff5c2;
\ No newline at end of file
+$yellow: #fff5c2;
+$yellow-dark: #ff9900;
\ No newline at end of file