diff --git a/browser/main/Detail/InfoButton.styl b/browser/main/Detail/InfoButton.styl
index 2de4c0f4..9a2604df 100644
--- a/browser/main/Detail/InfoButton.styl
+++ b/browser/main/Detail/InfoButton.styl
@@ -1,6 +1,6 @@
 .control-infoButton
   top 10px
-  topBarButtonLight()
+  topBarButtonRight()
 
 .infoButton
   padding 0px
diff --git a/browser/main/Detail/MarkdownNoteDetail.js b/browser/main/Detail/MarkdownNoteDetail.js
index 24e040a0..6621c4df 100644
--- a/browser/main/Detail/MarkdownNoteDetail.js
+++ b/browser/main/Detail/MarkdownNoteDetail.js
@@ -233,7 +233,7 @@ class MarkdownNoteDetail extends React.Component {
   }
 
   getToggleLockButton () {
-    return this.state.isLocked ? '../resources/icon/icon-lock.svg' : '../resources/icon/icon-unlock.svg'
+    return this.state.isLocked ? '../resources/icon/icon-edit-lock.svg' : '../resources/icon/icon-edit.svg'
   }
 
   handleDeleteKeyDown (e) {
diff --git a/browser/main/Detail/MarkdownNoteDetail.styl b/browser/main/Detail/MarkdownNoteDetail.styl
index 33168bb6..8385d3a6 100644
--- a/browser/main/Detail/MarkdownNoteDetail.styl
+++ b/browser/main/Detail/MarkdownNoteDetail.styl
@@ -13,7 +13,7 @@
 
 .control-lockButton
   top 150px
-  topBarButtonLight()
+  topBarButtonRight()
 
 .trashed-infopanel
   top 40px
@@ -21,7 +21,7 @@
 
 .control-fullScreenButton
   top 80px
-  topBarButtonLight()
+  topBarButtonRight()
 
 .body
   absolute left right
diff --git a/browser/main/Detail/SnippetNoteDetail.styl b/browser/main/Detail/SnippetNoteDetail.styl
index e661d07c..8e9d4deb 100644
--- a/browser/main/Detail/SnippetNoteDetail.styl
+++ b/browser/main/Detail/SnippetNoteDetail.styl
@@ -69,7 +69,7 @@
 .control-fullScreenButton
   top 80px
   margin-bottom 10px
-  topBarButtonLight()
+  topBarButtonRight()
 
 body[data-theme="white"]
   .root
diff --git a/browser/main/Detail/StarButton.styl b/browser/main/Detail/StarButton.styl
index b1880a8e..1e5bf239 100644
--- a/browser/main/Detail/StarButton.styl
+++ b/browser/main/Detail/StarButton.styl
@@ -1,6 +1,6 @@
 .root
   top 45px
-  topBarButtonLight()
+  topBarButtonRight()
   &:hover
     transition 0.2s
     color alpha($ui-favorite-star-button-color, 0.6)
diff --git a/browser/main/Detail/TrashButton.styl b/browser/main/Detail/TrashButton.styl
index 4410395f..0acd60a5 100644
--- a/browser/main/Detail/TrashButton.styl
+++ b/browser/main/Detail/TrashButton.styl
@@ -1,10 +1,10 @@
 .control-trashButton
   top 115px
-  topBarButtonLight()
+  topBarButtonRight()
 
 .control-trashButton--in-trash
   top 60px
-  topBarButtonLight()
+  topBarButtonRight()
 
 .trashButton
   padding 0px
diff --git a/browser/styles/index.styl b/browser/styles/index.styl
index de8c0e7f..949ca143 100644
--- a/browser/styles/index.styl
+++ b/browser/styles/index.styl
@@ -174,7 +174,7 @@ modal()
   overflow hidden
   border-radius $modal-border-radius
 
-topBarButtonLight()
+topBarButtonRight()
   position absolute
   width 34px
   height 34px
@@ -187,7 +187,7 @@ topBarButtonLight()
   &:active
     border-color $ui-button--active-backgroundColor
   &:hover
-    transform scale(1.1)
+    // transform scale(1.1)
     transition 0.4s
     color $ui-button-color
     .control-lockButton-tooltip
diff --git a/resources/icon/icon-edit-lock.svg b/resources/icon/icon-edit-lock.svg
new file mode 100644
index 00000000..12ede4cc
--- /dev/null
+++ b/resources/icon/icon-edit-lock.svg
@@ -0,0 +1,13 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="17px" height="19px" viewBox="0 0 17 19" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: Sketch 48.1 (47250) - http://www.bohemiancoding.com/sketch -->
+    <title>icon-edit-lock</title>
+    <desc>Created with Sketch.</desc>
+    <defs></defs>
+    <g id="Artboard" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" transform="translate(-1443.000000, -336.000000)" stroke-linecap="round" stroke-linejoin="round">
+        <g id="icon-edit-lock" transform="translate(1444.000000, 337.000000)" stroke="#1EC38B" stroke-width="1.66666667">
+            <polygon id="Shape" points="9.16666667 0 12.5 3.42857143 3.33333333 12.8571429 0 12.8571429 0 9.42857143"></polygon>
+            <path d="M0,17.1428571 L15,17.1428571" id="Shape"></path>
+        </g>
+    </g>
+</svg>
\ No newline at end of file
diff --git a/resources/icon/icon-edit.svg b/resources/icon/icon-edit.svg
new file mode 100644
index 00000000..3707c6fe
--- /dev/null
+++ b/resources/icon/icon-edit.svg
@@ -0,0 +1,13 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="17px" height="19px" viewBox="0 0 17 19" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: Sketch 48.1 (47250) - http://www.bohemiancoding.com/sketch -->
+    <title>icon-edit</title>
+    <desc>Created with Sketch.</desc>
+    <defs></defs>
+    <g id="Artboard" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" transform="translate(-1464.000000, -336.000000)" stroke-linecap="round" stroke-linejoin="round">
+        <g id="icon-edit" transform="translate(1465.000000, 337.000000)" stroke="#C7C7C7" stroke-width="1.66666667">
+            <polygon id="Shape" points="9.16666667 0 12.5 3.42857143 3.33333333 12.8571429 0 12.8571429 0 9.42857143"></polygon>
+            <path d="M0,17.1428571 L15,17.1428571" id="Shape"></path>
+        </g>
+    </g>
+</svg>
\ No newline at end of file