diff --git a/src/css/app.scss b/src/css/app.scss
index e8f38c54..1488da86 100644
--- a/src/css/app.scss
+++ b/src/css/app.scss
@@ -147,3 +147,21 @@ html {
   color: hsl(var(--positive-fg));
   background-color: hsl(var(--positive-bg));
 }
+
+.app-text-male {
+  color: hsl(var(--gender-male));
+}
+
+.app-bg-male {
+  color: hsl(var(--positive-fg));
+  background-color: hsl(var(--gender-male)) !important;
+}
+
+.app-text-female {
+  color: hsl(var(--gender-female));
+}
+
+.app-bg-female {
+  color: hsl(var(--positive-fg));
+  background-color: hsl(var(--gender-female)) !important;
+}