diff --git a/app/javascript/application.scss b/app/javascript/application.scss
index 91aca432..4c705821 100644
--- a/app/javascript/application.scss
+++ b/app/javascript/application.scss
@@ -131,6 +131,8 @@ label.primary-button {
 
 :root {
   --tooltip-color: black;
+  --employee-color: #FFD687;
+  --manager-color: #D6E4FD;
 }
 
 .tooltip-bottom-end:before {
@@ -205,3 +207,28 @@ label.primary-button {
   outline-offset: 3px;
   outline-color: hsl(var(--bc) / 0.2);
 }
+
+/* Custom party colors */
+.bg-employee-color {
+  background-color: var(--employee-color);
+}
+
+.bg-manager-color {
+  background-color: var(--manager-color);
+}
+
+.bg-employee-bg-color {
+  background-color: var(--employee-color);
+}
+
+.bg-manager-bg-color {
+  background-color: var(--manager-color);
+}
+
+.border-employee-color {
+  border-color: var(--employee-color);
+}
+
+.border-manager-color {
+  border-color: var(--manager-color);
+}
diff --git a/app/javascript/template_builder/area.vue b/app/javascript/template_builder/area.vue
index e0a5937e..df631ef0 100644
--- a/app/javascript/template_builder/area.vue
+++ b/app/javascript/template_builder/area.vue
@@ -447,8 +447,8 @@ export default {
     },
     borderColors () {
       return [
-        'border-red-500/80',
-        'border-sky-500/80',
+        'border-employee-color',
+        'border-manager-color',
         'border-emerald-500/80',
         'border-yellow-300/80',
         'border-purple-600/80',
@@ -461,8 +461,8 @@ export default {
     },
     bgColors () {
       return [
-        'bg-red-100',
-        'bg-sky-100',
+        'bg-employee-bg-color',
+        'bg-manager-bg-color',
         'bg-emerald-100',
         'bg-yellow-100',
         'bg-purple-100',
diff --git a/app/javascript/template_builder/field_submitter.vue b/app/javascript/template_builder/field_submitter.vue
index a3151288..f344e597 100644
--- a/app/javascript/template_builder/field_submitter.vue
+++ b/app/javascript/template_builder/field_submitter.vue
@@ -287,8 +287,8 @@ export default {
   computed: {
     colors () {
       return [
-        'bg-red-500',
-        'bg-sky-500',
+        'bg-employee-color',
+        'bg-manager-color',
         'bg-emerald-500',
         'bg-yellow-300',
         'bg-purple-600',
diff --git a/spec/factories/templates.rb b/spec/factories/templates.rb
index 784fbf09..428500c7 100644
--- a/spec/factories/templates.rb
+++ b/spec/factories/templates.rb
@@ -18,7 +18,8 @@ FactoryBot.define do
     end
 
     after(:create) do |template, ev|
-      party_names = ['Employee', 'Manager', 'Third Party', 'Fourth Party', 'Fifth Party', 'Sixth Party', 'Seventh Party', 'Eighth Party', 'Ninth Party', 'Tenth Party']
+      party_names = ['Employee', 'Manager', 'Third Party', 'Fourth Party', 'Fifth Party', 'Sixth Party',
+                     'Seventh Party', 'Eighth Party', 'Ninth Party', 'Tenth Party']
 
       template.submitters = Array.new(ev.submitter_count) do |i|
         {