diff --git a/src/Common/CodeBlock.luau b/src/Common/CodeBlock.luau
index 5172303b..7ad00dab 100644
--- a/src/Common/CodeBlock.luau
+++ b/src/Common/CodeBlock.luau
@@ -1,3 +1,4 @@
+local Highlighter = require("@pkg/Highlighter")
 local React = require("@pkg/React")
 local Sift = require("@pkg/Sift")
 
@@ -6,6 +7,8 @@ local nextLayoutOrder = require("@root/Common/nextLayoutOrder")
 local useTheme = require("@root/Common/useTheme")
 
 local useMemo = React.useMemo
+local useRef = React.useRef
+local useEffect = React.useEffect
 
 local function getLineNumbers(str: string): string
 	return Sift.List.reduce(str:split("\n"), function(accumulator, _item, index)
@@ -21,11 +24,20 @@ export type Props = {
 
 local function StoryError(props: Props)
 	local theme = useTheme()
+	local ref = useRef(nil :: TextBox?)
 
 	local sourceColor = useMemo(function()
 		return if props.sourceColor then props.sourceColor else theme.text
 	end, { props.sourceColor })
 
+	useEffect(function()
+		Highlighter.matchStudioSettings()
+
+		Highlighter.highlight({
+			textObject = ref.current,
+		})
+	end, {})
+
 	return React.createElement("Frame", {
 		AutomaticSize = Enum.AutomaticSize.XY,
 		BackgroundTransparency = 0.5,
@@ -72,6 +84,7 @@ local function StoryError(props: Props)
 			TextWrapped = false,
 			LineHeight = 1,
 			Font = Enum.Font.RobotoMono,
+			ref = ref,
 		}),
 	})
 end
diff --git a/wally.toml b/wally.toml
index 8189576d..96fa8332 100644
--- a/wally.toml
+++ b/wally.toml
@@ -13,6 +13,7 @@ ReactRoblox = "jsdotlua/react-roblox@17.0.2"
 ReactSpring = "chriscerie/react-spring@2.0.0"
 Sift = "csqrl/sift@0.0.8"
 t = "osyrisrblx/t@3.0.0"
+Highlighter = "boatbomber/highlighter@0.9.0"
 
 # dev dependencies
 Roact = "roblox/roact@1.4.4"