From f8349bb927fc02184493b0023d17b5190f7c43a1 Mon Sep 17 00:00:00 2001
From: Ephraim Duncan <55143799+ephraimduncan@users.noreply.github.com>
Date: Tue, 23 Jul 2024 04:51:37 +0000
Subject: [PATCH] chore: add new colors (#1224)

Adds the colors from our design system revamp into our current CSS vars to be used
at a later point.
---
 packages/ui/styles/theme.css | 83 ++++++++++++++++++++++++++++++++++++
 1 file changed, 83 insertions(+)

diff --git a/packages/ui/styles/theme.css b/packages/ui/styles/theme.css
index 0a8b65ae1..d6d55f6c2 100644
--- a/packages/ui/styles/theme.css
+++ b/packages/ui/styles/theme.css
@@ -53,6 +53,89 @@
     --signer-orange: 36 92% 54%;
     --signer-yellow: 51 100% 43%;
     --signer-pink: 313 65% 57%;
+
+    /* Base - Neutral */
+    --new-neutral-50: 0, 0%, 96%;
+    --new-neutral-100: 0, 0%, 91%;
+    --new-neutral-200: 0, 0%, 82%;
+    --new-neutral-300: 0, 0%, 69%;
+    --new-neutral-400: 0, 0%, 53%;
+    --new-neutral-500: 0, 0%, 43%;
+    --new-neutral-600: 0, 0%, 36%;
+    --new-neutral-700: 0, 0%, 31%;
+    --new-neutral-800: 0, 0%, 27%;
+    --new-neutral-900: 0, 0%, 24%;
+    --new-neutral-950: 0, 0%, 9%;
+
+    /* Base - White */
+    --new-white-50: 0, 0%, 5%;
+    --new-white-60: 0, 0%, 6%;
+    --new-white-100: 0, 0%, 10%;
+    --new-white-200: 0, 0%, 20%;
+    --new-white-300: 0, 0%, 30%;
+    --new-white-400: 0, 0%, 40%;
+    --new-white-500: 0, 0%, 50%;
+    --new-white-600: 0, 0%, 60%;
+    --new-white-700: 0, 0%, 80%;
+    --new-white-800: 0, 0%, 90%;
+    --new-white-900: 0, 0%, 100%;
+
+    /* Primary - Green */
+    --new-primary-50: 98, 73%, 97%;
+    --new-primary-100: 95, 73%, 94%;
+    --new-primary-200: 94, 70%, 87%;
+    --new-primary-300: 95, 71%, 81%;
+    --new-primary-400: 95, 71%, 74%;
+    --new-primary-500: 95, 71%, 67%;
+    --new-primary-600: 95, 71%, 54%;
+    --new-primary-700: 95, 71%, 41%;
+    --new-primary-800: 95, 71%, 27%;
+    --new-primary-900: 95, 72%, 14%;
+    --new-primary-950: 95, 72%, 7%;
+
+    /* Secondary - Info */
+    --new-info-50: 210, 54%, 95%;
+    --new-info-100: 211, 57%, 90%;
+    --new-info-200: 212, 55%, 80%;
+    --new-info-300: 212, 56%, 70%;
+    --new-info-400: 212, 56%, 60%;
+    --new-info-500: 212, 56%, 50%;
+    --new-info-600: 212, 56%, 40%;
+    --new-info-700: 212, 56%, 30%;
+    --new-info-800: 212, 55%, 20%;
+    --new-info-900: 211, 57%, 10%;
+    --new-info-950: 214, 54%, 5%;
+
+    /* Secondary - Error */
+    --new-error-50: 4, 80%, 96%;
+    --new-error-100: 3, 78%, 91%;
+    --new-error-200: 3, 79%, 83%;
+    --new-error-300: 3, 79%, 74%;
+    --new-error-400: 3, 79%, 66%;
+    --new-error-500: 4, 79%, 57%;
+    --new-error-600: 3, 79%, 46%;
+    --new-error-700: 3, 79%, 34%;
+    --new-error-800: 3, 79%, 23%;
+    --new-error-900: 3, 79%, 11%;
+    --new-error-950: 3, 80%, 6%;
+
+    /* Secondary - Warning */
+    --new-warning-50: 39, 100%, 96%;
+    --new-warning-100: 40, 100%, 93%;
+    --new-warning-200: 39, 100%, 86%;
+    --new-warning-300: 39, 100%, 79%;
+    --new-warning-400: 39, 100%, 71%;
+    --new-warning-500: 39, 100%, 64%;
+    --new-warning-600: 39, 100%, 57%;
+    --new-warning-700: 39, 100%, 43%;
+    --new-warning-800: 39, 100%, 29%;
+    --new-warning-900: 39, 100%, 14%;
+    --new-warning-950: 38, 100%, 7%;
+
+    /* Surface */
+    --new-surface-black: 0, 0%, 0%;
+    --new-surface-white: 0, 0%, 91%;
+
   }
 
   .dark {