fix(SW-719): add title colors

components/TempDesignSystem/Text/Title/title.module.css

@@ -113,3 +113,31 @@
 .white {
   color: var(--UI-Opacity-White-100);
 }
+
+.primaryLight {
+  color: var(--Primary-Light-On-Surface-Text);
+}
+
+.secondaryLight {
+  color: var(--Secondary-Light-On-Surface-Text);
+}
+
+.tertiaryLight {
+  color: var(--Tertiary-Light-On-Surface-Text);
+}
+
+.primaryDark {
+  color: var(--Primary-Dark-On-Surface-Text);
+}
+
+.primaryDim {
+  color: var(--Primary-Dim-On-Surface-Text);
+}
+
+.primaryStrong {
+  color: var(--Primary-Strong-On-Surface-Text);
+}
+
+.image {
+  color: var(--Base-Text-Inverted);
+}

components/TempDesignSystem/Text/Title/variants.ts

@@ -11,6 +11,13 @@ const config = {
       peach80: styles.peach80,
       red: styles.red,
       white: styles.white,
+      primaryLight: styles.primaryLight,
+      secondaryLight: styles.secondaryLight,
+      tertiaryLight: styles.tertiaryLight,
+      primaryDark: styles.primaryDark,
+      primaryDim: styles.primaryDim,
+      primaryStrong: styles.primaryStrong,
+      image: styles.image,
     },
     textAlign: {
       center: styles.center,