diff --git a/services/web/frontend/stylesheets/abstracts/mixins.scss b/services/web/frontend/stylesheets/abstracts/mixins.scss
index e8b6acff40..6fa996b535 100644
--- a/services/web/frontend/stylesheets/abstracts/mixins.scss
+++ b/services/web/frontend/stylesheets/abstracts/mixins.scss
@@ -68,11 +68,11 @@
 
 @mixin editor-switcher-button {
   @include ol-button-variant(
-    $color: var(--green-60),
+    $color: var(--bg-accent-02),
     $background: var(--bg-accent-03),
-    $border: var(--green-50),
+    $border: var(--bg-accent-01),
     $hover-background: var(--bg-accent-03),
-    $hover-border: var(--green-40),
+    $hover-border: var(--bg-accent-01),
     $borderless: false
   );
 }
diff --git a/services/web/frontend/stylesheets/components/nav.scss b/services/web/frontend/stylesheets/components/nav.scss
index b8abfa651c..78b25c7e11 100644
--- a/services/web/frontend/stylesheets/components/nav.scss
+++ b/services/web/frontend/stylesheets/components/nav.scss
@@ -34,20 +34,20 @@
     calc(var(--navbar-btn-padding-h) + 1px);
   --navbar-subdued-color: var(--white);
   --navbar-subdued-hover-bg: var(--white);
-  --navbar-subdued-hover-color: var(--green-50);
+  --navbar-subdued-hover-color: var(--bg-accent-01);
 
   // Properties of "primary" items
   --navbar-primary-color: var(--white);
-  --navbar-primary-border-color: var(--green-50);
-  --navbar-primary-bg: var(--green-50);
-  --navbar-primary-hover-bg: var(--green-60);
+  --navbar-primary-border-color: var(--bg-accent-01);
+  --navbar-primary-bg: var(--bg-accent-01);
+  --navbar-primary-hover-bg: var(--bg-accent-02);
   --navbar-primary-hover-border-color: var(--navbar-primary-hover-bg);
 
   // Links
   --navbar-link-color: var(--white);
   --navbar-link-border-color: var(--navbar-link-color);
   --navbar-link-hover-color: var(--white);
-  --navbar-link-hover-bg: var(--green-50);
+  --navbar-link-hover-bg: var(--bg-accent-01);
   --navbar-link-hover-border-color: var(--navbar-link-hover-bg);
 
   // Toggler
diff --git a/services/web/frontend/stylesheets/foundations/colors.scss b/services/web/frontend/stylesheets/foundations/colors.scss
index d9382b5dc8..a14116583c 100644
--- a/services/web/frontend/stylesheets/foundations/colors.scss
+++ b/services/web/frontend/stylesheets/foundations/colors.scss
@@ -109,9 +109,9 @@ $border-disabled: $neutral-20;
 $border-active: $blue-50;
 $border-danger: $red-50;
 $border-divider: $neutral-20;
-$link-web: $green-60;
-$link-web-hover: $green-70;
-$link-web-visited: $green-60;
+$link-web: $accent;
+$link-web-hover: $accent-dark;
+$link-web-visited: $accent;
 $link-ui: $blue-50;
 $link-ui-hover: $blue-60;
 $link-ui-visited: $blue-60;
@@ -129,9 +129,9 @@ $border-disabled-dark: $neutral-80;
 $border-active-dark: $blue-30;
 $border-danger-dark: $red-40;
 $border-divider-dark: $neutral-80;
-$link-web-dark: $green-30;
-$link-web-hover-dark: $green-40;
-$link-web-visited-dark: $green-40;
+$link-web-dark: $blue-30;
+$link-web-hover-dark: $blue-40;
+$link-web-visited-dark: $blue-40;
 $link-ui-dark: $blue-30;
 $link-ui-hover-dark: $blue-40;
 $link-ui-visited-dark: $blue-40;
@@ -222,9 +222,9 @@ $link-ui-visited-dark: $blue-40;
   --border-danger: var(--red-50);
   --border-divider: var(--neutral-20);
   --border-dark-divider: var(--neutral-70);
-  --link-web: var(--green-60);
-  --link-web-hover: var(--green-70);
-  --link-web-visited: var(--green-60);
+  --link-web: var(--bg-accent-01);
+  --link-web-hover: var(--bg-accent-02);
+  --link-web-visited: var(--bg-accent-01);
   --link-ui: var(--blue-50);
   --link-ui-hover: var(--blue-60);
   --link-ui-visited: var(--blue-60);
@@ -242,9 +242,9 @@ $link-ui-visited-dark: $blue-40;
   --border-active-dark: var(--blue-30);
   --border-danger-dark: var(--red-40);
   --border-divider-dark: var(--neutral-80);
-  --link-web-dark: var(--green-30);
-  --link-web-hover-dark: var(--green-40);
-  --link-web-visited-dark: var(--green-40);
+  --link-web-dark: var(--blue-30);
+  --link-web-hover-dark: var(--blue-40);
+  --link-web-visited-dark: var(--blue-40);
   --link-ui-dark: var(--blue-30);
   --link-ui-hover-dark: var(--blue-40);
   --link-ui-visited-dark: var(--blue-40);
diff --git a/services/web/frontend/stylesheets/pages/editor/file-tree.scss b/services/web/frontend/stylesheets/pages/editor/file-tree.scss
index 4b26760b37..4753eb506f 100644
--- a/services/web/frontend/stylesheets/pages/editor/file-tree.scss
+++ b/services/web/frontend/stylesheets/pages/editor/file-tree.scss
@@ -25,11 +25,11 @@
   .ide-redesign-main {
     --file-tree-item-hover-bg: var(--bg-light-secondary);
     --file-tree-item-selected-bg: var(--bg-accent-03);
-    --file-tree-item-selected-color: var(--green-70);
+    --file-tree-item-selected-color: var(--bg-accent-02);
     --file-tree-item-color: var(--content-primary);
     --file-tree-bg: var(--white);
     --file-tree-icon-colour: var(--content-primary);
-    --file-tree-item-dragging-bg: var(--green-60);
+    --file-tree-item-dragging-bg: var(--bg-accent-01);
     --file-tree-item-dragging-color: var(--white);
     --file-tree-item-icon-dragging-color: var(--file-tree-item-dragging-color);
     --file-tree-item-dragging-preview-bg: #{rgb($bg-light-secondary, 0.6)};
@@ -41,12 +41,12 @@
 // TODO ide-redesign-cleanup: Replace the existing styling with these overrides.
 .ide-redesign-main {
   --file-tree-item-hover-bg: var(--bg-dark-secondary);
-  --file-tree-item-selected-bg: var(--green-70);
-  --file-tree-item-selected-color: var(--green-10);
+  --file-tree-item-selected-bg: var(--bg-accent-01);
+  --file-tree-item-selected-color: var(--content-primary-dark);
   --file-tree-item-color: var(--content-primary-dark);
   --file-tree-bg: var(--bg-dark-primary);
   --file-tree-icon-colour: var(--content-primary-dark);
-  --file-tree-item-dragging-bg: var(--green-40);
+  --file-tree-item-dragging-bg: var(--bg-accent-01);
   --file-tree-item-dragging-color: var(--content-primary-dark);
   --file-tree-item-icon-dragging-color: var(--file-tree-item-dragging-color);
   --file-tree-item-dragging-preview-bg: #{rgb($bg-dark-secondary, 0.6)};
diff --git a/services/web/frontend/stylesheets/pages/editor/outline.scss b/services/web/frontend/stylesheets/pages/editor/outline.scss
index d2ce655962..7bf7820ed7 100644
--- a/services/web/frontend/stylesheets/pages/editor/outline.scss
+++ b/services/web/frontend/stylesheets/pages/editor/outline.scss
@@ -27,7 +27,7 @@
 
   .ide-redesign-main {
     --outline-item-highlight-bg: var(--bg-accent-03);
-    --outline-item-highlight-color: var(--green-70);
+    --outline-item-highlight-color: var(--bg-accent-02);
     --outline-item-highlight-font-weight: bold;
     --outline-line-guide-color: color-mix(
       in srgb,
@@ -46,8 +46,8 @@
   --outline-line-guide-color: var(--border-primary);
   --outline-container-color-bg: var(--bg-primary-themed);
   --outline-content-color: var(--content-primary-themed);
-  --outline-item-highlight-bg: var(--green-70);
-  --outline-item-highlight-color: var(--green-10);
+  --outline-item-highlight-bg: var(--bg-accent-01);
+  --outline-item-highlight-color: var(--content-primary-dark);
   --outline-item-highlight-font-weight: bold;
   --outline-item-carat-color: var(--content-primary-themed);