diff --git a/packages/web/src/jsontree/JSONNode.svelte b/packages/web/src/jsontree/JSONNode.svelte
index 3aaae9d0b..bf526e1ca 100644
--- a/packages/web/src/jsontree/JSONNode.svelte
+++ b/packages/web/src/jsontree/JSONNode.svelte
@@ -35,6 +35,8 @@
         return typeof value.set === 'function' ? JSONIterableMapNode : JSONIterableArrayNode;
       case 'MapEntry':
         return JSONMapEntryNode;
+      case 'ObjectId':
+        return JSONValueNode;
       default:
         return JSONValueNode;
     }
@@ -64,6 +66,8 @@
       case 'Function':
       case 'Symbol':
         return raw => raw.toString();
+      case 'ObjectId':
+        return raw => `ObjectId("${raw.$oid}")`;
       default:
         return () => `<${nodeType}>`;
     }
diff --git a/packages/web/src/jsontree/JSONValueNode.svelte b/packages/web/src/jsontree/JSONValueNode.svelte
index dfefe41a5..b9f15ab98 100644
--- a/packages/web/src/jsontree/JSONValueNode.svelte
+++ b/packages/web/src/jsontree/JSONValueNode.svelte
@@ -19,6 +19,9 @@
   .String {
     color: var(--string-color);
   }
+  .ObjectId {
+    color: var(--number-color);
+  }
   .Date {
     color: var(--date-color);
   }
diff --git a/packages/web/src/jsontree/objType.js b/packages/web/src/jsontree/objType.js
index d644fab58..38a50e637 100644
--- a/packages/web/src/jsontree/objType.js
+++ b/packages/web/src/jsontree/objType.js
@@ -1,4 +1,8 @@
 export default function objType(obj) {
+  if (obj?.$oid) {
+    return 'ObjectId';
+  }
+  
   const type = Object.prototype.toString.call(obj).slice(8, -1);
   if (type === 'Object') {
     if (typeof obj[Symbol.iterator] === 'function') {