diff --git a/html/results/index.php b/html/results/index.php
index 0b8942c..cabd98a 100644
--- a/html/results/index.php
+++ b/html/results/index.php
@@ -4,9 +4,10 @@ require_once __DIR__ . '/../../core.php';
 require_once __DIR__ . '/../../lib/rating.php';
 
 $mobs = getMobsWithMetaData();
+$trends = getRatingTrends();
 
 $title = "MobMash - Results";
-$content = function () use ($mobs) {
+$content = function () use ($mobs, $trends) {
     require __DIR__ . '/../../view/pages/results.php';
 };
 
diff --git a/html/styles/main.css b/html/styles/main.css
index 7cebb07..2179f84 100644
--- a/html/styles/main.css
+++ b/html/styles/main.css
@@ -104,6 +104,6 @@ h1 {
     margin-left: 2.5vw;
 }
 
-.results-list img {
-    max-height: 25px;
-}
\ No newline at end of file
+.results-list img, .results-list canvas {
+    height: 100px;
+}
diff --git a/lib/rating.php b/lib/rating.php
index 8d63c12..c04e7c9 100644
--- a/lib/rating.php
+++ b/lib/rating.php
@@ -52,4 +52,27 @@ function getMobsWithMetaData($orderBy = "rating", $direction = "DESC"): array {
     );
     $query->execute();
     return $query->fetchAll(PDO::FETCH_ASSOC);
+}
+
+function getRatingTrends(): array {
+    global $pdo;
+    $query = $pdo->prepare(<<<EOF
+        SELECT * FROM mm_rating_trends
+        ORDER BY date ASC;
+    EOF
+    );
+    $query->execute();
+    $results = $query->fetchAll(PDO::FETCH_ASSOC);
+
+    $trends = [];
+    foreach ($results as $result) {
+        $trendsForMob = [];
+        if (isset($trends[$result['mob']])) {
+            $trendsForMob = $trends[$result['mob']];
+        }
+        $trendsForMob[] = $result;
+        $trends[$result['mob']] = $trendsForMob;
+    }
+
+    return $trends;
 }
\ No newline at end of file
diff --git a/resources/js/index.js b/resources/js/index.js
index 91641f7..c0c648d 100644
--- a/resources/js/index.js
+++ b/resources/js/index.js
@@ -1,4 +1,7 @@
 import './htmx';
 import './img-preload.ext';
 
-import './spinner';
\ No newline at end of file
+import './spinner';
+
+import {Chart} from 'chart.js/auto';
+window.Chart = Chart;
\ No newline at end of file
diff --git a/resources/js/package-lock.json b/resources/js/package-lock.json
index 86f08bc..7bd821c 100644
--- a/resources/js/package-lock.json
+++ b/resources/js/package-lock.json
@@ -9,6 +9,7 @@
       "version": "0.0.1",
       "license": "MIT",
       "dependencies": {
+        "chart.js": "^4.4.3",
         "htmx.org": "^2.0.1"
       },
       "devDependencies": {
@@ -399,6 +400,22 @@
         "node": ">=18"
       }
     },
+    "node_modules/@kurkle/color": {
+      "version": "0.3.2",
+      "resolved": "https://registry.npmjs.org/@kurkle/color/-/color-0.3.2.tgz",
+      "integrity": "sha512-fuscdXJ9G1qb7W8VdHi+IwRqij3lBkosAm4ydQtEmbY58OzHXqQhvlxqEkoz0yssNVn38bcpRWgA9PP+OGoisw=="
+    },
+    "node_modules/chart.js": {
+      "version": "4.4.3",
+      "resolved": "https://registry.npmjs.org/chart.js/-/chart.js-4.4.3.tgz",
+      "integrity": "sha512-qK1gkGSRYcJzqrrzdR6a+I0vQ4/R+SoODXyAjscQ/4mzuNzySaMCd+hyVxitSY1+L2fjPD1Gbn+ibNqRmwQeLw==",
+      "dependencies": {
+        "@kurkle/color": "^0.3.0"
+      },
+      "engines": {
+        "pnpm": ">=8"
+      }
+    },
     "node_modules/esbuild": {
       "version": "0.23.0",
       "resolved": "https://registry.npmjs.org/esbuild/-/esbuild-0.23.0.tgz",
diff --git a/resources/js/package.json b/resources/js/package.json
index ca52e5e..53bb30b 100644
--- a/resources/js/package.json
+++ b/resources/js/package.json
@@ -10,6 +10,7 @@
   "author": "",
   "license": "MIT",
   "dependencies": {
+    "chart.js": "^4.4.3",
     "htmx.org": "^2.0.1"
   },
   "devDependencies": {
diff --git a/resources/js/spinner.js b/resources/js/spinner.js
index 24acd72..dfbb5ae 100644
--- a/resources/js/spinner.js
+++ b/resources/js/spinner.js
@@ -24,7 +24,7 @@ window.stopSpinner = () => {
 
 window.addEventListener("load", () => {
     document.querySelector(".middle .spinner img")
-        .addEventListener("animationend", () => {
+        ?.addEventListener("animationend", () => {
             endAnimation();
             if (spinnerActive) {
                 triggerAnimation();
diff --git a/view/fragments/mobListItem.php b/view/fragments/mobListItem.php
index eca711d..4c58e35 100644
--- a/view/fragments/mobListItem.php
+++ b/view/fragments/mobListItem.php
@@ -1,5 +1,6 @@
 <?php
     $mob ??= [];
+    $trends ??= [];
 ?>
 <tr>
     <td>
@@ -23,4 +24,39 @@
     <td>
         <?= $mob["losses"] ?>
     </td>
+    <td>
+        <canvas id="trend-<?= $mob["id"] ?>"></canvas>
+        <script>
+            (function() {
+                const dates = JSON.parse('<?=
+                    json_encode(array_map(fn($datapoint) => $datapoint["date"], $trends[$mob["id"]]))
+                ?>');
+                const ratings = JSON.parse('<?=
+                    json_encode(array_map(fn($datapoint) => doubleval($datapoint["rating"]), $trends[$mob["id"]]))
+                ?>');
+                new Chart("trend-<?= $mob["id"] ?>", {
+                    type: "line",
+                    data: {
+                        labels: dates,
+                        datasets: [
+                            {
+                                fill: false,
+                                data: ratings,
+                            }
+                        ]
+                    },
+                    options: {
+                        plugins: {
+                            legend: {
+                                display: false,
+                            },
+                        },
+                        aspectRatio: 5,
+                        animation: false,
+                    }
+                });
+            })();
+        </script>
+        <noscript>Trend graphs need JavaScript, unfortunately. : (</noscript>
+    </td>
 </tr>