diff --git a/scripts/logviewer/index.html b/scripts/logviewer/index.html
index e5f89cac..6533f1fa 100644
--- a/scripts/logviewer/index.html
+++ b/scripts/logviewer/index.html
@@ -23,6 +23,7 @@
               min-width: 0;
               min-height: 0;
               overflow-y: auto;
+              padding: 8px;
             }
 
             main section h2 {
diff --git a/scripts/logviewer/main.js b/scripts/logviewer/main.js
index 13d4975d..11ab7661 100644
--- a/scripts/logviewer/main.js
+++ b/scripts/logviewer/main.js
@@ -81,7 +81,7 @@ async function loadFile() {
     const fragment = logs.items.reduce((fragment, item, i, items) => {
         const prevItem = i === 0 ? null : items[i - 1];
         fragment.appendChild(t.section([
-            t.h2(prevItem ? `+ ${itemStart(item) - itemEnd(prevItem)} ms` : new Date(itemStart(item)).toString()),
+            t.h2(prevItem ? `+ ${formatTime(itemStart(item) - itemEnd(prevItem))}` : new Date(itemStart(item)).toString()),
             t.div({className: "timeline"}, t.ol(itemToNode(item, [i])))
         ]));
         return fragment;
@@ -89,6 +89,20 @@ async function loadFile() {
     main.replaceChildren(fragment);
 }
 
+function formatTime(ms) {
+    if (ms < 1000) {
+        return `${ms}ms`;
+    } else if (ms < 1000 * 60) {
+        return `${(ms / 1000).toFixed(2)}s`;
+    } else if (ms < 1000 * 60 * 60) {
+        return `${(ms / (1000 * 60)).toFixed(2)}m`;
+    } else if (ms < 1000 * 60 * 60 * 24) {
+        return `${(ms / (1000 * 60 * 60)).toFixed(2)}h`;
+    } else  {
+        return `${(ms / (1000 * 60 * 60 * 24)).toFixed(2)}d`;
+    }
+}
+
 function itemChildren(item) { return item.c; }
 function itemStart(item) { return item.s; }
 function itemEnd(item) { return item.s + item.d; }