diff --git a/app/src/assets/scss/_list.scss b/app/src/assets/scss/_list.scss
index 0e0ca903d..ed9eff012 100644
--- a/app/src/assets/scss/_list.scss
+++ b/app/src/assets/scss/_list.scss
@@ -117,6 +117,14 @@
       flex-shrink: 0;
       height: 14px;
       width: 12px;
+      line-height: 14px;
+      font-size: 12px;
+
+      // doc icon in the bookmark panel
+      svg {
+        width: 12px;
+        height: 14px;
+      }
     }
 
     &__arrow {
diff --git a/app/src/util/Tree.ts b/app/src/util/Tree.ts
index c1ac13cf5..acc05d115 100644
--- a/app/src/util/Tree.ts
+++ b/app/src/util/Tree.ts
@@ -104,7 +104,7 @@ ${item.label ? "data-label='" + item.label + "'" : ""}>
             }
             let iconHTML;
             if (item.type === "NodeDocument") {
-                iconHTML = `<span data-defids='["${item.defID}"]' class="b3-list-item__icon popover__block" data-id="${item.id}">${unicode2Emoji(item.ial.icon || Constants.SIYUAN_IMAGE_FILE)}</span>`
+                iconHTML = `<span data-defids='["${item.defID}"]' class="b3-list-item__graphic popover__block" data-id="${item.id}">${unicode2Emoji(item.ial.icon || Constants.SIYUAN_IMAGE_FILE)}</span>`
             } else {
                 iconHTML = `<svg data-defids='["${item.defID}"]' class="b3-list-item__graphic popover__block" data-id="${item.id}"><use xlink:href="#${getIconByType(item.type, item.subType)}"></use></svg>`
             }