diff --git a/ui/timetable.module.css b/ui/timetable.module.css
index 60564d2..3a01dee 100644
--- a/ui/timetable.module.css
+++ b/ui/timetable.module.css
@@ -38,5 +38,9 @@
 }
 
 .break {
-	background-color: rgb(78, 78, 143);
+	background-color: color-mix(in oklab, var(--background), rgb(50, 50, 255) 60%);
+}
+
+.event {
+	background-color: color-mix(in oklab, var(--background), rgb(255, 125, 50) 60%);
 }
diff --git a/ui/timetable.tsx b/ui/timetable.tsx
index 82b3385..bcb2a97 100644
--- a/ui/timetable.tsx
+++ b/ui/timetable.tsx
@@ -387,7 +387,11 @@ export default function Timetable() {
 			<tbody>
 				{locations.map(location => <tr key={location.id}>
 					<th>{location.name}</th>
-					{locationRows.get(location.id)!.map((row, index) => <td key={index} colSpan={row.span}>
+					{locationRows.get(location.id)!.map((row, index) => <td
+						key={index}
+						colSpan={row.span}
+						className={row.slots.size ? styles.event : undefined}
+					>
 						{[...row.slots].map(slot => eventBySlotId.get(slot.id)!.name).join(", ")}
 					</td>)}
 				</tr>)}