diff --git a/web/src/common/styles.ts b/web/src/common/styles.ts
index 41ec8d363..0480da4a6 100644
--- a/web/src/common/styles.ts
+++ b/web/src/common/styles.ts
@@ -1,3 +1,4 @@
+import { css, CSSResult } from "lit-element";
 // @ts-ignore
 import PF from "@patternfly/patternfly/patternfly.css";
 // @ts-ignore
@@ -6,10 +7,31 @@ import PFAddons from "@patternfly/patternfly/patternfly-addons.css";
 import FA from "@fortawesome/fontawesome-free/css/fontawesome.css";
 // @ts-ignore
 import AKGlobal from "../authentik.css";
-import { CSSResult } from "lit-element";
 // @ts-ignore
 import CodeMirrorStyle from "codemirror/lib/codemirror.css";
 // @ts-ignore
 import CodeMirrorTheme from "codemirror/theme/monokai.css";
-
-export const COMMON_STYLES: CSSResult[] = [PF, PFAddons, FA, AKGlobal, CodeMirrorStyle, CodeMirrorTheme];
+export const ColorStyles = css`
+    .pf-m-success {
+        color: var(--pf-global--success-color--100);
+    }
+    .pf-c-button.pf-m-success {
+        color: var(--pf-c-button--m-primary--Color);
+        background-color: var(--pf-global--success-color--100);
+    }
+    .pf-m-warning {
+        color: var(--pf-global--warning-color--100);
+    }
+    .pf-c-button.pf-m-warning {
+        color: var(--pf-c-button--m-primary--Color);
+        background-color: var(--pf-global--warning-color--100);
+    }
+    .pf-m-danger {
+        color: var(--pf-global--danger-color--100);
+    }
+    .pf-c-button.pf-m-danger {
+        color: var(--pf-c-button--m-primary--Color);
+        background-color: var(--pf-global--danger-color--100);
+    }
+`;
+export const COMMON_STYLES: CSSResult[] = [PF, PFAddons, FA, AKGlobal, CodeMirrorStyle, CodeMirrorTheme, ColorStyles];
diff --git a/web/src/constants.ts b/web/src/constants.ts
index 73871e963..f91ede3be 100644
--- a/web/src/constants.ts
+++ b/web/src/constants.ts
@@ -5,27 +5,4 @@ export const SUCCESS_CLASS = "pf-m-success";
 export const ERROR_CLASS = "pf-m-danger";
 export const PROGRESS_CLASS = "pf-m-in-progress";
 export const CURRENT_CLASS = "pf-m-current";
-export const ColorStyles = css`
-    .pf-m-success {
-        color: var(--pf-global--success-color--100);
-    }
-    .pf-c-button.pf-m-success {
-        color: var(--pf-c-button--m-primary--Color);
-        background-color: var(--pf-global--success-color--100);
-    }
-    .pf-m-warning {
-        color: var(--pf-global--warning-color--100);
-    }
-    .pf-c-button.pf-m-warning {
-        color: var(--pf-c-button--m-primary--Color);
-        background-color: var(--pf-global--warning-color--100);
-    }
-    .pf-m-danger {
-        color: var(--pf-global--danger-color--100);
-    }
-    .pf-c-button.pf-m-danger {
-        color: var(--pf-c-button--m-primary--Color);
-        background-color: var(--pf-global--danger-color--100);
-    }
-`;
 export const VERSION = "2021.2.5-stable";
diff --git a/web/src/elements/buttons/SpinnerButton.ts b/web/src/elements/buttons/SpinnerButton.ts
index 99aca32fa..206aa9442 100644
--- a/web/src/elements/buttons/SpinnerButton.ts
+++ b/web/src/elements/buttons/SpinnerButton.ts
@@ -5,7 +5,8 @@ import GlobalsStyle from "@patternfly/patternfly/base/patternfly-globals.css";
 import ButtonStyle from "@patternfly/patternfly/components/Button/button.css";
 // @ts-ignore
 import SpinnerStyle from "@patternfly/patternfly/components/Spinner/spinner.css";
-import { ColorStyles, PRIMARY_CLASS, PROGRESS_CLASS } from "../../constants";
+import { PRIMARY_CLASS, PROGRESS_CLASS } from "../../constants";
+import { ColorStyles } from "../../common/styles";
 
 @customElement("ak-spinner-button")
 export class SpinnerButton extends LitElement {
diff --git a/web/src/elements/buttons/TokenCopyButton.ts b/web/src/elements/buttons/TokenCopyButton.ts
index 5b68818e0..46c7880b0 100644
--- a/web/src/elements/buttons/TokenCopyButton.ts
+++ b/web/src/elements/buttons/TokenCopyButton.ts
@@ -4,7 +4,8 @@ import GlobalsStyle from "@patternfly/patternfly/base/patternfly-globals.css";
 // @ts-ignore
 import ButtonStyle from "@patternfly/patternfly/components/Button/button.css";
 import { tokenByIdentifier } from "../../api/Tokens";
-import { ColorStyles, ERROR_CLASS, PRIMARY_CLASS, SUCCESS_CLASS } from "../../constants";
+import { ERROR_CLASS, PRIMARY_CLASS, SUCCESS_CLASS } from "../../constants";
+import { ColorStyles } from "../../common/styles";
 
 @customElement("ak-token-copy-button")
 export class TokenCopyButton extends LitElement {
diff --git a/web/src/elements/cards/AggregateCard.ts b/web/src/elements/cards/AggregateCard.ts
index 4f21daf5f..101114df0 100644
--- a/web/src/elements/cards/AggregateCard.ts
+++ b/web/src/elements/cards/AggregateCard.ts
@@ -2,7 +2,6 @@ import { gettext } from "django";
 import { css, CSSResult, customElement, html, LitElement, property, TemplateResult } from "lit-element";
 import { ifDefined } from "lit-html/directives/if-defined";
 import { COMMON_STYLES } from "../../common/styles";
-import { ColorStyles } from "../../constants";
 
 @customElement("ak-aggregate-card")
 export class AggregateCard extends LitElement {
@@ -25,7 +24,7 @@ export class AggregateCard extends LitElement {
                 text-align: center;
                 color: var(--pf-global--Color--100);
             }
-        `, ColorStyles]);
+        `]);
     }
 
     renderInner(): TemplateResult {
diff --git a/web/src/elements/router/RouterOutlet.ts b/web/src/elements/router/RouterOutlet.ts
index e817ab306..5ce82f2f6 100644
--- a/web/src/elements/router/RouterOutlet.ts
+++ b/web/src/elements/router/RouterOutlet.ts
@@ -3,7 +3,6 @@ import { css, CSSResult, customElement, html, LitElement, property, TemplateResu
 import CodeMirrorStyle from "codemirror/lib/codemirror.css";
 // @ts-ignore
 import CodeMirrorTheme from "codemirror/theme/monokai.css";
-import { ColorStyles } from "../../constants";
 import { COMMON_STYLES } from "../../common/styles";
 import { Route } from "./Route";
 import { ROUTES } from "../../routes";
@@ -23,7 +22,6 @@ export class RouterOutlet extends LitElement {
         return [
             CodeMirrorStyle,
             CodeMirrorTheme,
-            ColorStyles,
             css`
                 :host {
                     height: 100vh;