diff --git a/src/tui/formatters.js b/src/tui/formatters.js
index 3885a7191..11bc758b4 100644
--- a/src/tui/formatters.js
+++ b/src/tui/formatters.js
@@ -8,14 +8,14 @@ const formatters = {
     actors: actors => actors.join(', '),
     rating: (rating) => {
         if (rating.stars === null) {
-            return 'Unrated';
+            return '\x1b[90mUnrated\x1b[0m';
         }
 
         if (rating.likes === null || rating.dislikes === null) {
-            return `★ ${rating.stars.toFixed(2)}`;
+            return `\x1b[93m★ ${rating.stars.toFixed(2)}\x1b[0m`;
         }
 
-        return `★ ${rating.stars.toFixed(2)} ▲ ${String(rating.likes).padEnd(3)} ▼ ${String(rating.dislikes).padEnd(3)}`;
+        return `\x1b[93m★\x1b[0m ${rating.stars.toFixed(2)} \x1b[92m▲\x1b[0m ${String(rating.likes).padEnd(3)} \x1b[31m▼\x1b[0m ${String(rating.dislikes).padEnd(3)}`;
     },
 };
 
diff --git a/src/tui/render.js b/src/tui/render.js
index b50bbd723..434a84a95 100644
--- a/src/tui/render.js
+++ b/src/tui/render.js
@@ -21,8 +21,11 @@ function render(scenes, screen) {
                 : scene[column.value])
                 .toString();
 
-            const truncatedValue = value.length > column.width - 2 ? `${value.slice(0, column.width - 2 - 3)}...` : value;
-            const paddedValue = truncatedValue.padEnd(column.width - 1).padStart(column.width);
+            const realLength = value.replace(/\x1b\[\d+m/g, '').length;
+            const entityLength = value.length - realLength;
+
+            const truncatedValue = realLength > column.width - 2 ? `${value.slice(0, column.width - 2 - 3)}...` : value;
+            const paddedValue = truncatedValue.padEnd(column.width + entityLength - 1).padStart(column.width + entityLength);
             const coloredValue = isFuture ? `\x1b[92m${paddedValue}\x1b[0m` : `\x1b[97m${paddedValue}\x1b[0m`;
 
             return `${acc}${coloredValue}\x1b[90m│\x1b[0m`;