diff --git a/web/components/button.css b/web/components/button.css
--- a/web/components/button.css
+++ b/web/components/button.css
@@ -67,11 +67,11 @@
 
 .btn:disabled {
   cursor: not-allowed;
-  color: var(--btn-disabled-color);
+  color: var(--button-label-primary-disabled);
 }
 
 .btn:not(.outline):disabled::before {
-  background-color: var(--btn-bg-disabled);
+  background-color: var(--button-background-primary-disabled);
 }
 
 .text {
diff --git a/web/modals/input.css b/web/modals/input.css
--- a/web/modals/input.css
+++ b/web/modals/input.css
@@ -1,5 +1,5 @@
 .label {
-  color: var(--fg);
+  color: var(--text-background-primary-default);
   font-weight: var(--bold);
   font-size: var(--xl-font-20);
   line-height: var(--line-height-text);
@@ -7,17 +7,17 @@
 
 .input {
   padding: 12px;
-  background: var(--modal-bg);
-  color: var(--fg);
+  background: var(--inputField-background-primary-default);
+  color: var(--inputField-label-primary-default);
 }
 
 .input[type='text'],
 .input[type='password'] {
-  border: 1px solid var(--border-color);
+  border: 1px solid var(--inputField-border-primary-default);
   box-sizing: border-box;
   width: 100%;
   font-size: var(--m-font-16);
   line-height: var(--line-height-text);
-  color: var(--fg);
+  color: var(--inputField-label-primary-default);
   border-radius: 4px;
 }
diff --git a/web/modals/modal.css b/web/modals/modal.css
--- a/web/modals/modal.css
+++ b/web/modals/modal.css
@@ -1,6 +1,6 @@
 div.modalContainer {
   display: flex;
-  background-color: var(--modal-bg);
+  background-color: var(--modal-background-primary-default);
   border-radius: 8px;
   flex-direction: column;
   margin: 20px;
@@ -23,11 +23,11 @@
 }
 
 .modalButton {
-  color: var(--modal-close-color);
+  color: var(--modal-close-primary-default);
 }
 
 .modalButton:hover {
-  color: var(--modal-close-color-hover);
+  color: var(--modal-close-primary-hover);
 }
 
 div.modalHeader {
@@ -50,7 +50,7 @@
   font-size: 20px;
   font-weight: 500;
   line-height: 32px;
-  color: var(--fg);
+  color: var(--modal-header-primary-default);
   display: flex;
   align-items: center;
   column-gap: 8px;
diff --git a/web/settings/password-change-modal.css b/web/settings/password-change-modal.css
--- a/web/settings/password-change-modal.css
+++ b/web/settings/password-change-modal.css
@@ -1,6 +1,5 @@
 .modal-body {
   padding: 24px 40px 32px;
-  color: var(--fg);
 }
 .form-footer {
   display: flex;
@@ -10,7 +9,7 @@
 }
 .modal-form-error {
   font-size: var(--xs-font-12);
-  color: var(--error);
+  color: var(--text-background-danger-default);
   font-style: italic;
   padding-left: 6px;
   align-self: center;
@@ -30,12 +29,11 @@
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
-  color: var(--fg);
   margin-bottom: 16px;
 }
 .username-label {
-  color: var(--account-settings-label);
+  color: var(--text-background-tertiary-default);
 }
 .username {
-  color: var(--fg);
+  color: var(--text-background-primary-default);
 }
diff --git a/web/theme.css b/web/theme.css
--- a/web/theme.css
+++ b/web/theme.css
@@ -129,8 +129,6 @@
   --app-list-icon-read-only-color: var(--shades-black-60);
   --app-list-icon-enabled-color: var(--success-primary);
   --app-list-icon-disabled-color: var(--shades-white-80);
-  --account-settings-label: var(--shades-black-60);
-  --account-button-color: var(--violet-dark-100);
   --chat-thread-list-color-active: var(--shades-white-60);
   --chat-thread-list-menu-color: var(--shades-white-60);
   --chat-thread-list-menu-bg: var(--shades-black-80);
@@ -269,18 +267,32 @@
   --text-background-primary-default: var(--shades-white-100);
   --text-background-secondary-default: var(--shades-white-60);
   --text-background-tertiary-default: var(--shades-black-60);
+  --text-background-danger-default: var(--error-primary);
 
   /* Button */
   --button-background-primary-default: var(--violet-dark-100);
   --button-background-primary-hover: var(--violet-dark-80);
+  --button-background-primary-disabled: var(--shades-black-80);
   --button-label-primary-default: var(--shades-white-100);
   --button-label-primary-hover: var(--shades-white-90);
+  --button-label-primary-disabled: var(--shades-black-60);
 
   /* Link */
   --link-background-primary-default: var(--violet-dark-100);
 
   /* Separator */
   --separator-background-primary-default: var(--shades-black-80);
+
+  /* Modal */
+  --modal-background-primary-default: var(--shades-black-90);
+  --modal-header-primary-default: var(--shades-white-100);
+  --modal-close-primary-default: var(--shades-black-60);
+  --modal-close-primary-hover: var(--shades-white-100);
+
+  /* Input Field */
+  --inputField-background-primary-default: var(--shades-black-90);
+  --inputField-label-primary-default: var(--shades-white-100);
+  --inputField-border-primary-default: var(--shades-black-80);
 }
 
 /* Light theme */
@@ -292,16 +304,30 @@
   --text-background-primary-default: var(--shades-black-100);
   --text-background-secondary-default: var(--shades-black-70);
   --text-background-tertiary-default: var(--shades-black-60);
+  --text-background-danger-default: var(--error-primary);
 
   /* Button */
   --button-background-primary-default: var(--violet-dark-100);
   --button-background-primary-hover: var(--violet-dark-80);
+  --button-background-primary-disabled: var(--shades-white-60);
   --button-label-primary-default: var(--shades-white-100);
   --button-label-primary-hover: var(--shades-white-90);
+  --button-label-primary-disabled: var(--shades-black-60);
 
   /* Link */
   --link-background-primary-default: var(--violet-dark-100);
 
   /* Separator */
   --separator-background-primary-default: var(--shades-white-60);
+
+  /* Modal */
+  --modal-background-primary-default: var(--shades-white-100);
+  --modal-header-primary-default: var(--shades-black-100);
+  --modal-close-primary-default: var(--shades-black-60);
+  --modal-close-primary-hover: var(--shades-black-100);
+
+  /* Input Field */
+  --inputField-background-primary-default: var(--shades-white-100);
+  --inputField-label-primary-default: var(--shades-black-100);
+  --inputField-border-primary-default: var(--shades-white-60);
 }