diff --git a/src/main/twirl/gitbucket/core/account/main.scala.html b/src/main/twirl/gitbucket/core/account/main.scala.html
index b4467f9..22e9c28 100644
--- a/src/main/twirl/gitbucket/core/account/main.scala.html
+++ b/src/main/twirl/gitbucket/core/account/main.scala.html
@@ -14,9 +14,9 @@
           </div>
           <div class="block">
             @if(account.url.isDefined){
-              <div><i class="icon-home"></i> <a href="@account.url">@account.url</a></div>
+              <div><i class="octicon octicon-home"></i> <a href="@account.url">@account.url</a></div>
             }
-            <div><i class="icon-time"></i> <span class="muted">Joined on</span> @date(account.registeredDate)</div>
+            <div><i class="octicon octicon-clock"></i> <span class="muted">Joined on</span> @date(account.registeredDate)</div>
           </div>
           @if(groupNames.nonEmpty){
             <div>
diff --git a/src/main/twirl/gitbucket/core/account/newrepo.scala.html b/src/main/twirl/gitbucket/core/account/newrepo.scala.html
index 0a0869b..2fe1915 100644
--- a/src/main/twirl/gitbucket/core/account/newrepo.scala.html
+++ b/src/main/twirl/gitbucket/core/account/newrepo.scala.html
@@ -13,7 +13,7 @@
           <span class="caret"></span>
         </button>
         <ul class="dropdown-menu">
-          <li><a href="javascript:void(0);" data-name="@loginAccount.get.userName"><i class="icon-ok"></i> <span>@avatar(loginAccount.get.userName, 20) @loginAccount.get.userName</span></a></li>
+          <li><a href="javascript:void(0);" data-name="@loginAccount.get.userName"><i class="octicon octicon-check"></i> <span>@avatar(loginAccount.get.userName, 20) @loginAccount.get.userName</span></a></li>
           @groupNames.map { groupName =>
             <li><a href="javascript:void(0);" data-name="@groupName"><i class="icon-white"></i> <span>@avatar(groupName, 20) @groupName</span></a></li>
           }
@@ -40,7 +40,7 @@
     <fieldset>
       <label class="radio">
         <input type="radio" name="isPrivate" value="true" @if(!isCreateRepoOptionPublic){checked}>
-        <span class="strong"><i class="icon-lock"></i>&nbsp;</i>&nbsp;Private</span><br>
+        <span class="strong"><i class="octicon octicon-lock"></i>&nbsp;</i>&nbsp;Private</span><br>
         <div>
           <span>Only collaborators can read this repository.</span>
         </div>
diff --git a/src/main/twirl/gitbucket/core/account/repositories.scala.html b/src/main/twirl/gitbucket/core/account/repositories.scala.html
index b515163..744c0cf 100644
--- a/src/main/twirl/gitbucket/core/account/repositories.scala.html
+++ b/src/main/twirl/gitbucket/core/account/repositories.scala.html
@@ -16,7 +16,7 @@
           <div class="block-header">
             <a href="@url(repository)">@repository.name</a>
             @if(repository.repository.isPrivate){
-              <i class="icon-lock"></i>
+              <i class="octicon octicon-lock"></i>
             }
           </div>
           @if(repository.repository.originUserName.isDefined){
diff --git a/src/main/twirl/gitbucket/core/admin/users/list.scala.html b/src/main/twirl/gitbucket/core/admin/users/list.scala.html
index 1c8f17b..d18f4c6 100644
--- a/src/main/twirl/gitbucket/core/admin/users/list.scala.html
+++ b/src/main/twirl/gitbucket/core/admin/users/list.scala.html
@@ -43,10 +43,10 @@
             <div>
               <hr>
               @if(!account.isGroupAccount){
-                <i class="icon-envelope"></i> @account.mailAddress
+                <i class="octicon octicon-mail"></i> @account.mailAddress
               }
               @account.url.map { url =>
-                <i class="icon-home"></i> @url
+                <i class="octicon octicon-home"></i> @url
               }
             </div>
             <div>
diff --git a/src/main/twirl/gitbucket/core/helper/checkicon.scala.html b/src/main/twirl/gitbucket/core/helper/checkicon.scala.html
index b9726a7..308ee41 100644
--- a/src/main/twirl/gitbucket/core/helper/checkicon.scala.html
+++ b/src/main/twirl/gitbucket/core/helper/checkicon.scala.html
@@ -1,6 +1,6 @@
 @(condition: => Boolean)
 @if(condition){
-  <i class="icon-ok"></i>
+  <i class="octicon octicon-check"></i>
 } else {
   <i class="icon-white"></i>
 }
\ No newline at end of file
diff --git a/src/main/twirl/gitbucket/core/helper/commitcomment.scala.html b/src/main/twirl/gitbucket/core/helper/commitcomment.scala.html
index d9ff70c..3e24feb 100644
--- a/src/main/twirl/gitbucket/core/helper/commitcomment.scala.html
+++ b/src/main/twirl/gitbucket/core/helper/commitcomment.scala.html
@@ -24,8 +24,8 @@
         </span>
       <span class="pull-right">
         @if(hasWritePermission || loginAccount.map(_.userName == comment.commentedUserName).getOrElse(false)){
-          <a href="#" data-comment-id="@comment.commentId"><i class="icon-pencil"></i></a>&nbsp;
-          <a href="#" data-comment-id="@comment.commentId"><i class="icon-remove-circle"></i></a>
+          <a href="#" data-comment-id="@comment.commentId"><i class="octicon octicon-pencil"></i></a>&nbsp;
+          <a href="#" data-comment-id="@comment.commentId"><i class="octicon octicon-x"></i></a>
         }
       </span>
     </div>
diff --git a/src/main/twirl/gitbucket/core/helper/copy.scala.html b/src/main/twirl/gitbucket/core/helper/copy.scala.html
index 7a09a52..cf527ea 100644
--- a/src/main/twirl/gitbucket/core/helper/copy.scala.html
+++ b/src/main/twirl/gitbucket/core/helper/copy.scala.html
@@ -1,7 +1,7 @@
 @(id: String, value: String)(html: Html)
 <div class="input-append" style="margin-bottom: 0px;">
   @html
-  <span id="@id" class="add-on btn" data-clipboard-text="@value" data-placement="bottom" title="copy to clipboard"><i class="icon-check"></i></span>
+  <span id="@id" class="add-on btn" data-clipboard-text="@value" data-placement="bottom" title="copy to clipboard"><i class="octicon octicon-clippy"></i></span>
 </div>
 <script>
 // copy to clipboard
diff --git a/src/main/twirl/gitbucket/core/helper/datepicker.scala.html b/src/main/twirl/gitbucket/core/helper/datepicker.scala.html
index c221629..dc3217b 100644
--- a/src/main/twirl/gitbucket/core/helper/datepicker.scala.html
+++ b/src/main/twirl/gitbucket/core/helper/datepicker.scala.html
@@ -2,7 +2,7 @@
 @import gitbucket.core.view.helpers
 <div id="@name" class="input-append date" data-date-format="yyyy-mm-dd" data-date="@value.map(helpers.date)">
   <input class="span2" name="@name" type="text" readonly="" value="@value.map(helpers.date)" size="16"/>
-  <span class="add-on"><i class="icon-calendar"></i></span>
+  <span class="add-on"><i class="octicon octicon-calendar"></i></span>
 </div>
 <script>
 $(function(){
diff --git a/src/main/twirl/gitbucket/core/helper/dropdown.scala.html b/src/main/twirl/gitbucket/core/helper/dropdown.scala.html
index 20e2f4a..f374647 100644
--- a/src/main/twirl/gitbucket/core/helper/dropdown.scala.html
+++ b/src/main/twirl/gitbucket/core/helper/dropdown.scala.html
@@ -9,7 +9,7 @@
       @if(flat){style="border: none; background-color: #eee;"}
       class="dropdown-toggle @if(!flat){btn} else {flat} @if(mini){btn-mini} else {btn-small}" data-toggle="dropdown">
     @if(value.isEmpty){
-      <i class="icon-cog"></i>
+      <i class="octicon octicon-gear"></i>
     } else {
       @if(prefix.nonEmpty){
         <span class="muted">@prefix:</span>
diff --git a/src/main/twirl/gitbucket/core/issues/issueinfo.scala.html b/src/main/twirl/gitbucket/core/issues/issueinfo.scala.html
index 4f1daed..9f790c3 100644
--- a/src/main/twirl/gitbucket/core/issues/issueinfo.scala.html
+++ b/src/main/twirl/gitbucket/core/issues/issueinfo.scala.html
@@ -38,7 +38,7 @@
   @if(hasWritePermission){
     <div class="pull-right">
       @helper.html.dropdown(right = true) {
-        <li><a href="javascript:void(0);" class="milestone" data-id=""><i class="icon-remove-circle"></i> Clear this milestone</a></li>
+        <li><a href="javascript:void(0);" class="milestone" data-id=""><i class="octicon octicon-x"></i> Clear this milestone</a></li>
         @milestones.filter(_._1.closedDate.isEmpty).map { case (milestone, _, _) =>
           <li>
             <a href="javascript:void(0);" class="milestone" data-id="@milestone.milestoneId" data-title="@milestone.title">
@@ -89,7 +89,7 @@
   @if(hasWritePermission){
     <div class="pull-right">
       @helper.html.dropdown(right = true) {
-        <li><a href="javascript:void(0);" class="assign" data-name=""><i class="icon-remove-circle"></i> Clear assignee</a></li>
+        <li><a href="javascript:void(0);" class="assign" data-name=""><i class="octicon octicon-x"></i> Clear assignee</a></li>
         @collaborators.map { collaborator =>
           <li>
             <a href="javascript:void(0);" class="assign" data-name="@collaborator">
diff --git a/src/main/twirl/gitbucket/core/issues/listparts.scala.html b/src/main/twirl/gitbucket/core/issues/listparts.scala.html
index 1ea3e34..bd2aafe 100644
--- a/src/main/twirl/gitbucket/core/issues/listparts.scala.html
+++ b/src/main/twirl/gitbucket/core/issues/listparts.scala.html
@@ -138,7 +138,7 @@
             }
           }
           @helper.html.dropdown("Assignee", flat = true) {
-            <li><a href="javascript:void(0);" class="toggle-assign" data-name=""><i class="icon-remove-circle"></i> Clear assignee</a></li>
+            <li><a href="javascript:void(0);" class="toggle-assign" data-name=""><i class="octicon octicon-x"></i> Clear assignee</a></li>
             @collaborators.map { collaborator =>
               <li><a href="javascript:void(0);" class="toggle-assign" data-name="@collaborator"><i class="icon-white"></i>@avatar(collaborator, 20) @collaborator</a></li>
             }
diff --git a/src/main/twirl/gitbucket/core/pulls/compare.scala.html b/src/main/twirl/gitbucket/core/pulls/compare.scala.html
index 1a22858..ca72073 100644
--- a/src/main/twirl/gitbucket/core/pulls/compare.scala.html
+++ b/src/main/twirl/gitbucket/core/pulls/compare.scala.html
@@ -24,7 +24,7 @@
         <span class="label label-info monospace">@originRepository.owner:@originId</span> ... <span class="label label-info monospace">@forkedRepository.owner:@forkedId</span>
       </div>
       <div id="compare-edit" style="display: none;">
-        <a href="#" id="cancel-condition-editing" class="pull-right"><i class="icon-remove-circle"></i></a>
+        <a href="#" id="cancel-condition-editing" class="pull-right"><i class="octicon octicon-x"></i></a>
         @helper.html.dropdown(originRepository.owner + "/" + originRepository.name, "base fork") {
           @members.map { case (owner, name) =>
             <li><a href="#" class="origin-owner" data-owner="@owner" data-name="@name">@helper.html.checkicon(owner == originRepository.owner) @owner/@name</a></li>
diff --git a/src/main/twirl/gitbucket/core/repo/blob.scala.html b/src/main/twirl/gitbucket/core/repo/blob.scala.html
index bd186af..9ce56ba 100644
--- a/src/main/twirl/gitbucket/core/repo/blob.scala.html
+++ b/src/main/twirl/gitbucket/core/repo/blob.scala.html
@@ -11,7 +11,7 @@
   @html.menu("code", repository){
     <div class="head">
       <div class="pull-right hide-if-blame"><div class="btn-group">
-        <a href="@url(repository)/find/@encodeRefName(branch)" class="btn btn-mini" data-toggle="tooltip" data-placement="bottom" data-hotkey="t" title="Quickly jump between files"><i class="icon icon-th-list"></i></a>
+        <a href="@url(repository)/find/@encodeRefName(branch)" class="btn btn-mini" data-toggle="tooltip" data-placement="bottom" data-hotkey="t" title="Quickly jump between files"><i class="octicon octicon-list-unordered"></i></a>
       </div></div>
       <div class="line-age-legend">
         <span>Newer</span>
diff --git a/src/main/twirl/gitbucket/core/repo/branches.scala.html b/src/main/twirl/gitbucket/core/repo/branches.scala.html
index 7b4eded..22d9eee 100644
--- a/src/main/twirl/gitbucket/core/repo/branches.scala.html
+++ b/src/main/twirl/gitbucket/core/repo/branches.scala.html
@@ -45,9 +45,9 @@
                 }
                 @if(hasWritePermission){
                   @if(prs.map(!_._2.closed).getOrElse(false)){
-                    <a class="btn disabled btn-mini" data-toggle="tooltip" title="You can’t delete this branch because it has an open pull request"><i class="icon icon-trash icon-white"></i></a>
+                    <a class="btn disabled btn-mini" data-toggle="tooltip" title="You can’t delete this branch because it has an open pull request"><i class="octicon octicon-trashcan"></i></a>
                   }else{
-                    <a href="@url(repository)/delete/@encodeRefName(branch.name)" class="btn  @if(info.isMerged){ btn-warning }else{ btn-danger } delete-branch btn-mini" data-name="@branch.name" @if(info.isMerged){ data-toggle="tooltip" title="this branch is merged" }><i class="icon icon-trash icon-white"></i></a>
+                    <a href="@url(repository)/delete/@encodeRefName(branch.name)" class="btn  @if(info.isMerged){ btn-warning }else{ btn-danger } delete-branch btn-mini" data-name="@branch.name" @if(info.isMerged){ data-toggle="tooltip" title="this branch is merged" }><i class="octicon octicon-trashcan"></i></a>
                   }
                 }
               }
diff --git a/src/main/twirl/gitbucket/core/repo/commit.scala.html b/src/main/twirl/gitbucket/core/repo/commit.scala.html
index c6bf89d..d96f8d5 100644
--- a/src/main/twirl/gitbucket/core/repo/commit.scala.html
+++ b/src/main/twirl/gitbucket/core/repo/commit.scala.html
@@ -74,7 +74,7 @@
             </div>
             @if(commit.isDifferentFromAuthor) {
             <div class="committer">
-              <span class="icon-arrow-right"></span>
+              <span class="octicon octicon-arrow-right"></span>
               <span>@user(commit.committerName, commit.committerEmailAddress, "username strong")</span>
               <span class="muted"> committed @helper.html.datetimeago(commit.commitTime)</span>
             </div>
diff --git a/src/main/twirl/gitbucket/core/repo/commits.scala.html b/src/main/twirl/gitbucket/core/repo/commits.scala.html
index 35c2149..41fee9e 100644
--- a/src/main/twirl/gitbucket/core/repo/commits.scala.html
+++ b/src/main/twirl/gitbucket/core/repo/commits.scala.html
@@ -60,7 +60,7 @@
                     @user(commit.authorName, commit.authorEmailAddress, "username")
                     <span class="muted">authored @helper.html.datetimeago(commit.authorTime)</span>
                     @if(commit.isDifferentFromAuthor) {
-                      <span class="icon-arrow-right" style="margin-top : -2px;"></span>
+                      <span class="octicon octicon-arrow-right" style="margin-top : -2px;"></span>
                       @user(commit.committerName, commit.committerEmailAddress, "username")
                       <span class="muted">committed @helper.html.datetimeago(commit.authorTime)</span>
                     }
diff --git a/src/main/twirl/gitbucket/core/repo/files.scala.html b/src/main/twirl/gitbucket/core/repo/files.scala.html
index dc74718..831a36d 100644
--- a/src/main/twirl/gitbucket/core/repo/files.scala.html
+++ b/src/main/twirl/gitbucket/core/repo/files.scala.html
@@ -17,13 +17,13 @@
       <div class="pull-right"><div class="btn-group">
         <a href="@url(repository)/find/@encodeRefName(branch)" class="btn btn-small" data-toggle="tooltip" data-placement="bottom" data-hotkey="t" title="Quickly jump between files"><i class="octicon octicon-list-unordered"></i></a>
         @if(pathList.nonEmpty){
-          <a href="@url(repository)/commits/@encodeRefName(branch)/@pathList.mkString("/")" class="btn btn-small" data-toggle="tooltip" data-placement="bottom" title="Browse commits for this branch"><i class="icon icon-time"></i></a>
+          <a href="@url(repository)/commits/@encodeRefName(branch)/@pathList.mkString("/")" class="btn btn-small" data-toggle="tooltip" data-placement="bottom" title="Browse commits for this branch"><i class="octicon octicon-clock"></i></a>
         }
       </div></div>
       @branchPullRequest.map{ case (pullRequest, issue) =>
         <a href="@url(repository)/pull/@pullRequest.issueId" class="btn btn-small btn-pullrequest-branch" title="@issue.title" data-toggle="tooltip">#@pullRequest.issueId</a>
       }.getOrElse{
-        <a href="@url(repository)/compare?head=@urlEncode(encodeRefName(branch))" class="btn btn-small btn-success"><i class="icon-white icon-retweet" data-toggle="tooltip" title="Compare, review, create a pull request"></i></a>
+        <a href="@url(repository)/compare?head=@urlEncode(encodeRefName(branch))" class="btn btn-small btn-success"><i class="octicon octicon-git-compare" data-toggle="tooltip" title="Compare, review, create a pull request"></i></a>
       }
       @helper.html.branchcontrol(
         branch,
@@ -66,7 +66,7 @@
               </div>
               @if(latestCommit.isDifferentFromAuthor) {
               <div class="committer">
-                <span class="icon-arrow-right"></span>
+                <span class="octicon octicon-arrow-right"></span>
                 <span>@user(latestCommit.committerName, latestCommit.committerEmailAddress, "username strong")</span>
                 <span class="muted"> committed @helper.html.datetimeago(latestCommit.commitTime)</span>
               </div>
diff --git a/src/main/twirl/gitbucket/core/repo/find.scala.html b/src/main/twirl/gitbucket/core/repo/find.scala.html
index 12490fd..4ac39e8 100644
--- a/src/main/twirl/gitbucket/core/repo/find.scala.html
+++ b/src/main/twirl/gitbucket/core/repo/find.scala.html
@@ -27,7 +27,7 @@
 <table id="tree-finder-results" class="table table-file-list" data-url="@url(repository)/tree-list/@treeId">
   <tbody class="tree-browser-result-template">
     <tr class="tree-browser-result">
-      <td class="icon"><span class="icon icon-chevron-right"></span></td>
+      <td class="icon"><span class="octicon octicon-chevron-right"></span></td>
       <td class="icon"><i class="octicon octicon-file-text"></i></td>
       <td>
         <a href="@url(repository)/blob/@encodeRefName(branch)"></a>
diff --git a/src/main/twirl/gitbucket/core/search/issues.scala.html b/src/main/twirl/gitbucket/core/search/issues.scala.html
index df7baa6..c7795ea 100644
--- a/src/main/twirl/gitbucket/core/search/issues.scala.html
+++ b/src/main/twirl/gitbucket/core/search/issues.scala.html
@@ -24,7 +24,7 @@
           Opened by <a href="@url(issue.openedUserName)" class="username">@issue.openedUserName</a>
           @helper.html.datetimeago(issue.registeredDate)
           @if(issue.commentCount > 0){
-            &nbsp;&nbsp;<i class="icon-comment"></i><span class="strong">@issue.commentCount</span> @plural(issue.commentCount, "comment")
+            &nbsp;&nbsp;<i class="octicon octicon-comment"></i><span class="strong">@issue.commentCount</span> @plural(issue.commentCount, "comment")
           }
         </div>
       </div>
diff --git a/src/main/webapp/assets/common/css/gitbucket.css b/src/main/webapp/assets/common/css/gitbucket.css
index 4a6904e..b272723 100644
--- a/src/main/webapp/assets/common/css/gitbucket.css
+++ b/src/main/webapp/assets/common/css/gitbucket.css
@@ -374,6 +374,22 @@
   cursor: pointer;
 }
 
+.btn .octicon {
+  color: #333;
+}
+
+.btn-success .octicon {
+  color: #fff;
+}
+
+.btn-warning .octicon {
+  color: #fff;
+}
+
+.btn-danger .octicon {
+  color: #fff;
+}
+
 /****************************************************************************/
 /* Side Menu */
 /****************************************************************************/