diff --git a/packages/frontend/core/src/components/explorer/docs-view/stack-property.tsx b/packages/frontend/core/src/components/explorer/docs-view/stack-property.tsx
index 317ddbb977..0e7977c4f4 100644
--- a/packages/frontend/core/src/components/explorer/docs-view/stack-property.tsx
+++ b/packages/frontend/core/src/components/explorer/docs-view/stack-property.tsx
@@ -10,7 +10,7 @@ export const StackProperty = ({
   return (
     <div className={styles.stackItem}>
       <div className={styles.stackItemContent}>
-        <div className={styles.stackItemIcon}>{icon}</div>
+        {icon ? <div className={styles.stackItemIcon}>{icon}</div> : null}
         <div className={styles.stackItemLabel}>{children}</div>
       </div>
     </div>
diff --git a/packages/frontend/core/src/components/workspace-property-types/tags.css.ts b/packages/frontend/core/src/components/workspace-property-types/tags.css.ts
index 2ed733b4a0..7b71406f9f 100644
--- a/packages/frontend/core/src/components/workspace-property-types/tags.css.ts
+++ b/packages/frontend/core/src/components/workspace-property-types/tags.css.ts
@@ -27,3 +27,6 @@ export const groupHeaderLabel = style({
 export const filterValueMenu = style({
   top: 'calc(var(--radix-popper-anchor-height) - 18px) !important',
 });
+export const moreTagsLabel = style({
+  marginLeft: 4,
+});
diff --git a/packages/frontend/core/src/components/workspace-property-types/tags.tsx b/packages/frontend/core/src/components/workspace-property-types/tags.tsx
index 8e0d4b24ef..0a77e362a3 100644
--- a/packages/frontend/core/src/components/workspace-property-types/tags.tsx
+++ b/packages/frontend/core/src/components/workspace-property-types/tags.tsx
@@ -209,19 +209,31 @@ const TagIcon = ({ tag, size = 8 }: { tag: Tag; size?: number }) => {
     />
   );
 };
+
 export const TagsDocListProperty = ({ doc }: { doc: DocRecord }) => {
+  const max = 3;
+  const t = useI18n();
   const tagList = useService(TagService).tagList;
   const tags = useLiveData(tagList.tagsByPageId$(doc.id));
 
+  const showRest = tags.length > max + 1;
+  const visibleTags = tags.length === max + 1 ? max + 1 : max;
+
   return (
     <>
-      {tags.map(tag => {
+      {tags.slice(0, visibleTags).map(tag => {
         return (
           <StackProperty icon={<TagIcon tag={tag} />} key={tag.id}>
             <TagName tag={tag} />
           </StackProperty>
         );
       })}
+      {showRest ? (
+        <StackProperty icon={null}>
+          <span>+{tags.length - max}</span>
+          <span className={styles.moreTagsLabel}>{t['Tags']()}</span>
+        </StackProperty>
+      ) : null}
     </>
   );
 };