diff --git a/code/modules/antagonists/traitor/datum_traitor.dm b/code/modules/antagonists/traitor/datum_traitor.dm
index 12a3b95e2ea..c47cfc75787 100644
--- a/code/modules/antagonists/traitor/datum_traitor.dm
+++ b/code/modules/antagonists/traitor/datum_traitor.dm
@@ -246,14 +246,14 @@
 	var/responses = jointext(GLOB.syndicate_code_response, ", ")
 
 	to_chat(traitor_mob, "<U><B>The Syndicate have provided you with the following codewords to identify fellow agents:</B></U>")
-	to_chat(traitor_mob, "<B>Code Phrase</B>: <font color=blue>[phrases]</font>")
-	to_chat(traitor_mob, "<B>Code Response</B>: <font color=red>[responses]</font>")
+	to_chat(traitor_mob, "<B>Code Phrase</B>: <span class='blue'>[phrases]</span>")
+	to_chat(traitor_mob, "<B>Code Response</B>: <span class='red'>[responses]</span>")
 
-	antag_memory += "<b>Code Phrase</b>: <font color=blue>[phrases]</font><br>"
-	antag_memory += "<b>Code Response</b>: <font color=red>[responses]</font><br>"
+	antag_memory += "<b>Code Phrase</b>: <span class='blue'>[phrases]</span><br>"
+	antag_memory += "<b>Code Response</b>: <span class='red'>[responses]</span><br>"
 
 	to_chat(traitor_mob, "Use the codewords during regular conversation to identify other agents. Proceed with caution, however, as everyone is a potential foe.")
-	to_chat(traitor_mob, "<font size=3 color=red>You memorize the codewords, allowing you to recognise them when heard.</font>")
+	to_chat(traitor_mob, "<span class='alertwarning'>You memorize the codewords, allowing you to recognise them when heard.</span>")
 
 /datum/antagonist/traitor/proc/add_law_zero()
 	var/mob/living/silicon/ai/killer = owner.current
diff --git a/code/modules/goonchat/browserassets/css/browserOutput.css b/code/modules/goonchat/browserassets/css/browserOutput.css
index f79bf982af9..0eab0aea60c 100644
--- a/code/modules/goonchat/browserassets/css/browserOutput.css
+++ b/code/modules/goonchat/browserassets/css/browserOutput.css
@@ -17,7 +17,7 @@ body {
     line-height: 1.2;
 	overflow-x: hidden;
 	overflow-y: scroll;
-	word-wrap: break-word;		
+	word-wrap: break-word;
 	scrollbar-face-color:#1A1A1A;
 	scrollbar-track-color:#171717;
 	scrollbar-highlight-color:#171717;
@@ -305,6 +305,7 @@ em						{font-style: normal;	font-weight: bold;}
 .userdanger				{color: #c51e1e;	font-weight: bold; font-size: 24px;}
 .danger					{color: #c51e1e;}
 .warning				{color: #c51e1e;	font-style: italic;}
+.alertwarning           {color: #FF0000;    font-weight: bold}
 .boldwarning			{color: #c51e1e;	font-style: italic;	font-weight: bold}
 .announce 				{color: #c51e1e;	font-weight: bold;}
 .boldannounce			{color: #c51e1e;	font-weight: bold;}
@@ -318,6 +319,8 @@ em						{font-style: normal;	font-weight: bold;}
 .unconscious			{color: #a4bad6;	font-weight: bold;}
 .suicide				{color: #ff5050;	font-style: italic;}
 .green					{color: #059223;}
+.red                    {color: #FF0000}
+.blue                   {color: #215cff}
 .nicegreen				{color: #059223;}
 .shadowling				{color: #8e8a99;}
 .cult					{color: #aa1c1c;}
diff --git a/code/modules/goonchat/browserassets/css/browserOutput_white.css b/code/modules/goonchat/browserassets/css/browserOutput_white.css
index cbf1daad751..09d2539039c 100644
--- a/code/modules/goonchat/browserassets/css/browserOutput_white.css
+++ b/code/modules/goonchat/browserassets/css/browserOutput_white.css
@@ -303,6 +303,7 @@ h1.alert, h2.alert		{color: #000000;}
 .userdanger				{color: #ff0000;	font-weight: bold; font-size: 24px;}
 .danger					{color: #ff0000;}
 .warning				{color: #ff0000;	font-style: italic;}
+.alertwarning           {color: #FF0000;    font-weight: bold}
 .boldwarning			{color: #ff0000;	font-style: italic;	font-weight: bold}
 .announce 				{color: #228b22;	font-weight: bold;}
 .boldannounce			{color: #ff0000;	font-weight: bold;}
@@ -316,7 +317,9 @@ h1.alert, h2.alert		{color: #000000;}
 .unconscious			{color: #0000ff;	font-weight: bold;}
 .suicide				{color: #ff5050;	font-style: italic;}
 .green					{color: #03ff39;}
-.nicegreen					{color: #14a833;}
+.red                    {color: #FF0000}
+.blue                   {color: #0000FF}
+.nicegreen				{color: #14a833;}
 .shadowling				{color: #3b2769;}
 .cult					{color: #960000;}
 
diff --git a/code/modules/mob/living/carbon/say.dm b/code/modules/mob/living/carbon/say.dm
index 41ee60d66cf..bbb65518d70 100644
--- a/code/modules/mob/living/carbon/say.dm
+++ b/code/modules/mob/living/carbon/say.dm
@@ -49,11 +49,11 @@
 
 	if (src.mind.has_antag_datum(/datum/antagonist/traitor))
 		for (var/codeword in GLOB.syndicate_code_phrase)
-			var/regex/codeword_match = new("(" + codeword + ")", "ig")
-			message = codeword_match.Replace(message, "<font color=blue>$1</font>")
+			var/regex/codeword_match = new("([codeword])", "ig")
+			message = codeword_match.Replace(message, "<span class='blue'>$1</span>")
 
 		for (var/codeword in GLOB.syndicate_code_response)
-			var/regex/codeword_match = new("(" + codeword + ")", "ig")
-			message = codeword_match.Replace(message, "<font color=red>$1</font>")
-			
+			var/regex/codeword_match = new("([codeword])", "ig")
+			message = codeword_match.Replace(message, "<span class='red'>$1</span>")
+
 	return message