diff --git a/src/util/color.ts b/src/util/color.ts
index f5357572..fc9b1ce7 100644
--- a/src/util/color.ts
+++ b/src/util/color.ts
@@ -126,3 +126,21 @@ export function getTitleAttr(bucket: IBucket, e: IEvent) {
     return e.data.title;
   }
 }
+
+export function getCategoryColorFromEvent(bucket: IBucket, e: IEvent) {
+  if (bucket.type == 'currentwindow') {
+    // NOTE: this will not work/break category rules which reference `$` or `^`
+    return getCategoryColorFromString(e.data.app + ' ' + e.data.title);
+  } else if (bucket.type == 'web.tab.current') {
+    // NOTE: same as above
+    return getCategoryColorFromString(e.data.title + ' ' + e.data.url);
+  } else if (bucket.type == 'afkstatus') {
+    return getColorFromString(e.data.status);
+  } else if (bucket.type?.startsWith('app.editor')) {
+    return getCategoryColorFromString(e.data.file);
+  } else if (bucket.type?.startsWith('general.stopwatch')) {
+    return getCategoryColorFromString(e.data.label);
+  } else {
+    return getCategoryColorFromString(e.data.title);
+  }
+}
diff --git a/src/visualizations/VisTimeline.vue b/src/visualizations/VisTimeline.vue
index 8fbbdbcd..14bee7de 100644
--- a/src/visualizations/VisTimeline.vue
+++ b/src/visualizations/VisTimeline.vue
@@ -38,7 +38,7 @@ import _ from 'lodash';
 import moment from 'moment';
 import Color from 'color';
 import { buildTooltip } from '../util/tooltip.js';
-import { getColorFromString, getTitleAttr } from '../util/color';
+import { getTitleAttr, getCategoryColorFromEvent } from '../util/color';
 
 import { Timeline } from 'vis-timeline/esnext';
 import 'vis-timeline/styles/vis-timeline-graph2d.css';
@@ -116,7 +116,7 @@ export default {
             buildTooltip(bucket, e),
             new Date(e.timestamp),
             new Date(moment(e.timestamp).add(e.duration, 'seconds').valueOf()),
-            getColorFromString(getTitleAttr(bucket, e)),
+            getCategoryColorFromEvent(bucket, e),
             e,
           ]);
         });