diff --git a/app/src/assets/scss/base.scss b/app/src/assets/scss/base.scss
index cca324764..3e79ecdfa 100644
--- a/app/src/assets/scss/base.scss
+++ b/app/src/assets/scss/base.scss
@@ -173,7 +173,9 @@ html {
     flex-shrink: 0;
     cursor: pointer;
     color: var(--b3-toolbar-color);
-    padding: 9px;
+    padding: 5px;
+    margin: 2px;
+    border-radius: 4px;
     box-sizing: border-box;
     transition: var(--b3-transition);
     display: flex;
@@ -181,6 +183,7 @@ html {
     background-color: transparent;
     border: 0;
     line-height: 13.5px;
+    height: 23.5px;
 
     &:not(.toolbar__item--disabled):not(.toolbar__item--close):hover,
     &--active {
diff --git a/app/src/constants.ts b/app/src/constants.ts
index f59ba2607..df60b5436 100644
--- a/app/src/constants.ts
+++ b/app/src/constants.ts
@@ -41,7 +41,7 @@ export abstract class Constants {
 
     // size
     public static readonly SIZE_LINK_TEXT_MAX: number = 24;
-    public static readonly SIZE_TOOLBAR_HEIGHT: number = isMobile() ? 0 : 32;
+    public static readonly SIZE_TOOLBAR_HEIGHT: number = isMobile() ? 0 : 28;
     public static readonly SIZE_GET_MAX = 102400;
     public static readonly SIZE_UNDO = 64;
     public static readonly SIZE_TITLE = 512;
diff --git a/app/src/layout/topBar.ts b/app/src/layout/topBar.ts
index e8c21c21d..0dc3575a9 100644
--- a/app/src/layout/topBar.ts
+++ b/app/src/layout/topBar.ts
@@ -37,17 +37,17 @@ export const updateEditModeElement = () => {
 export const initBar = (app: App) => {
     const toolbarElement = document.getElementById("toolbar");
     toolbarElement.innerHTML = `
-<div id="barWorkspace" class="toolbar__item">
+<div id="barWorkspace" class="toolbar__item toolbar__item--active">
     <span class="toolbar__text">${getWorkspaceName()}</span>
     <svg class="toolbar__svg"><use xlink:href="#iconDown"></use></svg>
 </div>
 <div id="barSync" data-position="top" data-type="a" class="toolbar__item${window.siyuan.config.readonly ? " fn__none" : ""}">
     <svg><use xlink:href="#iconCloudSucc"></use></svg>
 </div>
-<button id="barBack" data-menu="true" class="toolbar__item toolbar__item--disabled b3-tooltips b3-tooltips__se" aria-label="${window.siyuan.languages.goBack} ${updateHotkeyTip(window.siyuan.config.keymap.general.goBack.custom)}">
+<button id="barBack" data-type="a" class="toolbar__item toolbar__item--disabled" aria-label="${window.siyuan.languages.goBack} ${updateHotkeyTip(window.siyuan.config.keymap.general.goBack.custom)}">
     <svg><use xlink:href="#iconBack"></use></svg>
 </button>
-<button id="barForward" data-menu="true" class="toolbar__item toolbar__item--disabled b3-tooltips b3-tooltips__se" aria-label="${window.siyuan.languages.goForward} ${updateHotkeyTip(window.siyuan.config.keymap.general.goForward.custom)}">
+<button id="barForward" data-type="a" class="toolbar__item toolbar__item--disabled" aria-label="${window.siyuan.languages.goForward} ${updateHotkeyTip(window.siyuan.config.keymap.general.goForward.custom)}">
     <svg><use xlink:href="#iconForward"></use></svg>
 </button>
 <div class="fn__flex-1 fn__ellipsis" id="drag"><span class="fn__none">开发版，使用前请进行备份 Development version, please backup before use</span></div>