diff --git a/browser/components/NoteItem.styl b/browser/components/NoteItem.styl
index ca28eccb..2e643789 100644
--- a/browser/components/NoteItem.styl
+++ b/browser/components/NoteItem.styl
@@ -13,19 +13,18 @@ $control-height = 30px
   background-color $ui-noteList-backgroundColor
   transition background-color 0.15s
   &:hover
-    background-color alpha($ui-active-color, 20%)
+    background-color alpha($ui-button--active-backgroundColor, 40%)
   &:active
-    background-color $ui-active-color
-    color white
+    background-color $ui-button--active-backgroundColor
+    color $ui-text-color
     .item-title
     .item-title-empty
     .item-bottom-tagList-empty
     .item-bottom-time
     .item-title-icon
-      color white
     .item-bottom-tagList-item
       background-color transparent
-      color white
+      color $ui-text-color
 
 .item-wrapper
   padding 15px 0
@@ -33,21 +32,21 @@ $control-height = 30px
 
 .item--active
   @extend .item
-  background-color $ui-active-color
-  color white
+  background-color $ui-button--active-backgroundColor
+  color $ui-text-color
   .item-title
   .item-title-empty
   .item-bottom-tagList-empty
   .item-bottom-time
   .item-title-icon
-    color white
+    color $ui-text-color
   .item-bottom-tagList-item
     background-color transparent
-    color white
+    color $ui-text-color
   .item-wrapper
     border-color transparent
   &:hover
-    background-color $ui-active-color
+    background-color $ui-button--active-backgroundColor
 
 .item-title
   font-size 12px
@@ -57,7 +56,7 @@ $control-height = 30px
   padding-top 5px
   padding-bottom 20px
   overflow ellipsis
-  color $ui-text-color
+  color $ui-inactive-text-color
 
 .item-title-icon
   position absolute
diff --git a/browser/components/NoteItemSimple.styl b/browser/components/NoteItemSimple.styl
index be546f70..a51deb17 100644
--- a/browser/components/NoteItemSimple.styl
+++ b/browser/components/NoteItemSimple.styl
@@ -13,27 +13,27 @@ $control-height = 30px
   background-color $ui-noteList-backgroundColor
   transition background-color 0.15s
   &:hover
-    background-color alpha($ui-active-color, 20%)
+    background-color alpha($ui-button--active-backgroundColor, 40%)
   &:active
-    background-color $ui-active-color
-    color white
+    background-color $ui-button--active-backgroundColor
+    color $ui-text-color
     .item-simple-title
     .item-simple-title-empty
     .item-simple-title-icon
-      color white
+      color $ui-text-color
 
 .item-simple--active
   @extend .item-simple
-  background-color $ui-active-color
-  color white
+  background-color $ui-button--active-backgroundColor
+  color $ui-text-color
   .item-simple-title
   .item-simple-title-empty
     border-color transparent
-    color white
+    color $ui-text-color
   .item-simple-title-icon
-    color white
+    color $ui-text-color
   &:hover
-    background-color $ui-active-color
+    background-color $ui-button--active-backgroundColor
 
 .item-simple-title
   font-size 12px
@@ -42,7 +42,7 @@ $control-height = 30px
   line-height 24px
   padding-top 8px
   overflow ellipsis
-  color $ui-text-color
+  color $ui-inactive-text-color
   border-bottom $ui-border
 
 .item-simple-title-icon
diff --git a/browser/main/NoteList/NoteList.styl b/browser/main/NoteList/NoteList.styl
index 3484100e..d4e68574 100644
--- a/browser/main/NoteList/NoteList.styl
+++ b/browser/main/NoteList/NoteList.styl
@@ -35,18 +35,18 @@ $control-height = 30px
   padding 0
   background-color transparent
   border none
-  color $ui-inactive-text-color
+  color alpha($ui-inactive-text-color, 60%)
   transition 0.15s
   &:active, &:active:hover
-    color $ui-active-color
+    color $ui-inactive-text-color
   &:hover
-    color $ui-text-color
+    color $ui-inactive-text-color
 
 .control-button--active
   @extend .control-button
-  color $ui-active-color
+  color $ui-inactive-text-color
   &:hover
-    color $ui-active-color
+    color $ui-inactive-text-color
 
 .list
   absolute left right bottom