diff --git a/.github/workflows/commitlint.yml b/.github/workflows/commitlint.yml
new file mode 100644
index 0000000000..6151362d49
--- /dev/null
+++ b/.github/workflows/commitlint.yml
@@ -0,0 +1,12 @@
+name: Lint Commit Messages
+on: [pull_request, push]
+
+jobs:
+  commitlint:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v2
+        with:
+          fetch-depth: 0
+      - uses: wagoid/commitlint-github-action@v4
+
diff --git a/.husky/commit-msg b/.husky/commit-msg
new file mode 100755
index 0000000000..7fed48507b
--- /dev/null
+++ b/.husky/commit-msg
@@ -0,0 +1,4 @@
+#!/bin/sh
+. "$(dirname "$0")/_/husky.sh"
+
+npx --no -- commitlint --edit 
diff --git a/commitlint.config.js b/commitlint.config.js
new file mode 100644
index 0000000000..28fe5c5bf9
--- /dev/null
+++ b/commitlint.config.js
@@ -0,0 +1 @@
+module.exports = {extends: ['@commitlint/config-conventional']}
diff --git a/frontend/app_flowy/lib/workspace/presentation/home/navigation.dart b/frontend/app_flowy/lib/workspace/presentation/home/navigation.dart
index 069c0ee6e7..80e5e8c2de 100644
--- a/frontend/app_flowy/lib/workspace/presentation/home/navigation.dart
+++ b/frontend/app_flowy/lib/workspace/presentation/home/navigation.dart
@@ -1,6 +1,7 @@
 import 'package:app_flowy/workspace/domain/page_stack/page_stack.dart';
 import 'package:flowy_infra/image.dart';
 import 'package:flowy_infra/notifier.dart';
+import 'package:flowy_infra/theme.dart';
 import 'package:flowy_infra_ui/style_widget/icon_button.dart';
 import 'package:flowy_infra_ui/style_widget/text.dart';
 import 'package:flutter/material.dart';
@@ -81,6 +82,7 @@ class FlowyNavigation extends StatelessWidget {
   }
 
   Widget _renderCollapse(BuildContext context, PublishNotifier<bool> collapsedNotifier) {
+    final theme = context.watch<AppTheme>();
     return ChangeNotifierProvider.value(
       value: collapsedNotifier,
       child: Consumer(
@@ -94,7 +96,7 @@ class FlowyNavigation extends StatelessWidget {
                   notifier.value = false;
                 },
                 iconPadding: const EdgeInsets.fromLTRB(2, 2, 2, 2),
-                icon: svg("home/hide_menu"),
+                icon: svg("home/hide_menu", color: theme.iconColor),
               ),
             );
           } else {
diff --git a/frontend/app_flowy/packages/flowy_infra_ui/lib/style_widget/icon_button.dart b/frontend/app_flowy/packages/flowy_infra_ui/lib/style_widget/icon_button.dart
index 0b960a7abb..4087ccf25d 100644
--- a/frontend/app_flowy/packages/flowy_infra_ui/lib/style_widget/icon_button.dart
+++ b/frontend/app_flowy/packages/flowy_infra_ui/lib/style_widget/icon_button.dart
@@ -1,7 +1,9 @@
 import 'dart:math';
 
 import 'package:flowy_infra/image.dart';
+import 'package:flowy_infra/theme.dart';
 import 'package:flutter/material.dart';
+import 'package:provider/provider.dart';
 
 class FlowyIconButton extends StatelessWidget {
   final double width;
@@ -30,16 +32,6 @@ class FlowyIconButton extends StatelessWidget {
   @override
   Widget build(BuildContext context) {
     Widget child = icon;
-
-    // if (onPressed == null) {
-    //   child = ColorFiltered(
-    //     colorFilter: ColorFilter.mode(
-    //       Colors.grey,
-    //       BlendMode.saturation,
-    //     ),
-    //     child: child,
-    //   );
-    // }
     final size = Size(width, height ?? width);
 
     assert(size.width > iconPadding.horizontal);