diff --git a/docs/chat.php b/docs/chat.php
index 7210e2a..4591115 100644
--- a/docs/chat.php
+++ b/docs/chat.php
@@ -7,12 +7,16 @@ $msgs = json_decode(file_get_contents('https://mcp.dervland.net/messages'), true
 <h2>Scraftia (<a href='/' class='link'>Home</a>)</h2>
 <?php
 foreach ($msgs as $msg) {
+	$sys = ($msg['username'] == ':system');
+	$classes = '';
+	if ($sys && str_contains($msg['content'],'joined ')) $classes = 'joiner';
+	if ($sys && str_contains($msg['content'],'left ')) $classes = 'leaver';
     ?>
-	<div class="comment">
+	<div class="comment <?php echo $classes ?>">
 					<div class="avatar">
 						<div>
 							<div><b>
-								<?php echo htmlspecialchars($msg['username']); ?>
+								<?php echo htmlspecialchars($sys ? 'System User' : $msg['username']); ?>
 								</b></div>
 							<div><b>
 								<?php echo date(DATE_RFC2822, $msg['date'] * 0.001); ?>
diff --git a/docs/css/main.css b/docs/css/main.css
index d815aae..062f305 100644
--- a/docs/css/main.css
+++ b/docs/css/main.css
@@ -13,6 +13,14 @@
     font-family: var(--font) !important;
 }
 
+.comment.joiner {
+	background: rgb(78,180,78);
+}
+
+.comment.leaver {
+	background: rgb(180,78,78);
+}
+
 .img {
 	max-width: 500px;
 	max-height: 500px;