diff --git a/.changeset/early-years-accept.md b/.changeset/early-years-accept.md
new file mode 100644
index 0000000000..34fbfab975
--- /dev/null
+++ b/.changeset/early-years-accept.md
@@ -0,0 +1,21 @@
+---
+'@sl-design-system/breadcrumbs': minor
+'@sl-design-system/radio-group': minor
+'@sl-design-system/text-field': minor
+'@sl-design-system/text-area': minor
+'@sl-design-system/checkbox': minor
+'@sl-design-system/combobox': minor
+'@sl-design-system/listbox': minor
+'@sl-design-system/popover': minor
+'@sl-design-system/editor': minor
+'@sl-design-system/select': minor
+'@sl-design-system/switch': minor
+'@sl-design-system/panel': minor
+'@sl-design-system/form': minor
+'@sl-design-system/grid': minor
+'@sl-design-system/menu': minor
+'@sl-design-system/tabs': minor
+'@sl-design-system/tree': minor
+---
+
+Replace `--sl-size-borderWidth-subtle` with `--sl-size-borderWidth-default`
diff --git a/.changeset/vast-beers-attend.md b/.changeset/vast-beers-attend.md
new file mode 100644
index 0000000000..b83f4159de
--- /dev/null
+++ b/.changeset/vast-beers-attend.md
@@ -0,0 +1,5 @@
+---
+'@sl-design-system/switch': patch
+---
+
+Minor style fixes & improvements
diff --git a/packages/components/breadcrumbs/src/breadcrumbs.scss b/packages/components/breadcrumbs/src/breadcrumbs.scss
index 9b36f9fb72..160c7a5c83 100644
--- a/packages/components/breadcrumbs/src/breadcrumbs.scss
+++ b/packages/components/breadcrumbs/src/breadcrumbs.scss
@@ -66,7 +66,7 @@ a {
   overflow: clip visible;
   padding: var(--sl-size-100);
   text-decoration: underline;
-  text-decoration-thickness: var(--sl-size-borderWidth-subtle);
+  text-decoration-thickness: var(--sl-size-borderWidth-default);
   text-overflow: ellipsis;
   text-underline-offset: var(--sl-size-025);
   white-space: nowrap;
diff --git a/packages/components/checkbox/src/checkbox.scss b/packages/components/checkbox/src/checkbox.scss
index 92e25cbb32..e1c1bd1377 100644
--- a/packages/components/checkbox/src/checkbox.scss
+++ b/packages/components/checkbox/src/checkbox.scss
@@ -146,7 +146,7 @@
   aspect-ratio: 1;
   background: color-mix(in srgb, var(--_bg-color), var(--_bg-mix-color) calc(100% * var(--_bg-opacity)));
   block-size: var(--sl-size-300);
-  border: var(--sl-size-borderWidth-subtle) solid var(--_border);
+  border: var(--sl-size-borderWidth-default) solid var(--_border);
   border-radius: var(--sl-size-borderRadius-default);
   box-sizing: border-box;
   display: inline-flex;
diff --git a/packages/components/combobox/src/combobox.scss b/packages/components/combobox/src/combobox.scss
index ba24f11e12..520d264e7a 100644
--- a/packages/components/combobox/src/combobox.scss
+++ b/packages/components/combobox/src/combobox.scss
@@ -21,7 +21,7 @@ sl-text-field {
   max-inline-size: 100%;
 
   &:has(> sl-tag-list) {
-    padding-inline: calc(var(--sl-size-100) - var(--sl-size-borderWidth-subtle)) 0;
+    padding-inline: calc(var(--sl-size-100) - var(--sl-size-borderWidth-default)) 0;
   }
 }
 
@@ -38,7 +38,7 @@ sl-tag {
   outline-width: 0;
 
   &.focused {
-    outline: var(--sl-size-borderWidth-subtle) solid var(--sl-color-border-focused);
+    outline: var(--sl-size-borderWidth-default) solid var(--sl-color-border-focused);
   }
 }
 
@@ -50,7 +50,7 @@ sl-tag {
 
 [part='wrapper'] {
   background: var(--sl-elevation-surface-raised-default);
-  border: var(--sl-size-borderWidth-subtle) solid var(--sl-color-border-plain);
+  border: var(--sl-size-borderWidth-default) solid var(--sl-color-border-plain);
   border-radius: var(--sl-size-borderRadius-default);
   box-shadow: var(--sl-elevation-shadow-overlay);
   box-sizing: border-box;
diff --git a/packages/components/combobox/src/create-custom-option.scss b/packages/components/combobox/src/create-custom-option.scss
index 6d2eae2a04..3ed8140797 100644
--- a/packages/components/combobox/src/create-custom-option.scss
+++ b/packages/components/combobox/src/create-custom-option.scss
@@ -1,5 +1,5 @@
 :host {
-  border-block-end: var(--sl-color-border-plain) solid var(--sl-size-borderWidth-subtle);
+  border-block-end: var(--sl-color-border-plain) solid var(--sl-size-borderWidth-default);
   inline-size: 100%;
   margin-block-end: var(--sl-size-075);
   margin-inline: 0;
diff --git a/packages/components/combobox/src/selected-group.scss b/packages/components/combobox/src/selected-group.scss
index 328f043cee..7d90f75de4 100644
--- a/packages/components/combobox/src/selected-group.scss
+++ b/packages/components/combobox/src/selected-group.scss
@@ -3,7 +3,7 @@
 }
 
 :host([has-groups]) {
-  border-block-end: var(--sl-color-elevation-border-raised) solid var(--sl-size-borderWidth-subtle);
+  border-block-end: var(--sl-color-elevation-border-raised) solid var(--sl-size-borderWidth-default);
   margin-block-end: var(--sl-size-075);
   padding-block-end: var(--sl-size-100);
 
@@ -23,7 +23,7 @@
 }
 
 .other {
-  border-block-start: var(--sl-color-elevation-border-raised) solid var(--sl-size-borderWidth-subtle);
+  border-block-start: var(--sl-color-elevation-border-raised) solid var(--sl-size-borderWidth-default);
   margin-block: var(--sl-size-075) var(--sl-size-025);
   padding-block-start: var(--sl-size-175);
   padding-inline-start: var(--sl-size-300);
diff --git a/packages/components/editor/src/editor.scss b/packages/components/editor/src/editor.scss
index eaa017bee0..d29e33fe67 100644
--- a/packages/components/editor/src/editor.scss
+++ b/packages/components/editor/src/editor.scss
@@ -6,7 +6,7 @@
 
   background: var(--_background);
   background: color-mix(in srgb, var(--_bg-color), var(--_bg-mix-color) calc(100% * var(--_bg-opacity)));
-  border: var(--sl-size-borderWidth-subtle) solid var(--_border);
+  border: var(--sl-size-borderWidth-default) solid var(--_border);
   border-radius: var(--sl-size-borderRadius-default);
   color: var(--sl-color-foreground-plain);
   cursor: text;
diff --git a/packages/components/form/src/form.stories.ts b/packages/components/form/src/form.stories.ts
index 6461a7f712..857ec37311 100644
--- a/packages/components/form/src/form.stories.ts
+++ b/packages/components/form/src/form.stories.ts
@@ -95,13 +95,14 @@ export const Reset: Story = {
   args: {
     reset: true,
     reportValidity: true,
-    fields: () =>
-      html` <sl-form-field hint="Has value on load" label="Text field">
-          <sl-text-field name="input" placeholder="Placeholder" required value="Value set initially"></sl-text-field>
-        </sl-form-field>
-        <sl-form-field hint="Has no value on load" label="Text field">
-          <sl-text-field name="input2" placeholder="Placeholder" required></sl-text-field>
-        </sl-form-field>`,
+    fields: () => html`
+      <sl-form-field hint="Has value on load" label="Text field">
+        <sl-text-field name="input" placeholder="Placeholder" required value="Value set initially"></sl-text-field>
+      </sl-form-field>
+      <sl-form-field hint="Has no value on load" label="Text field">
+        <sl-text-field name="input2" placeholder="Placeholder" required></sl-text-field>
+      </sl-form-field>
+    `,
     value: {
       input: 'Value set initially'
     }
@@ -157,21 +158,21 @@ export const Value: Story = {
 
 export const All: Story = {
   args: {
-    fields: () => html`
+    fields: ({ disabled }) => html`
       <sl-form-field hint="Hint text" label="Text field">
-        <sl-text-field name="textField" placeholder="Placeholder" required></sl-text-field>
+        <sl-text-field ?disabled=${disabled} name="textField" placeholder="Placeholder" required></sl-text-field>
       </sl-form-field>
 
       <sl-form-field hint="Hint text" label="Text area">
-        <sl-text-area name="textArea" placeholder="Placeholder" required></sl-text-area>
+        <sl-text-area ?disabled=${disabled} name="textArea" placeholder="Placeholder" required></sl-text-area>
       </sl-form-field>
 
       <sl-form-field hint="Hint text" label="Checkbox">
-        <sl-checkbox name="checkbox" required value="checked">Checkbox</sl-checkbox>
+        <sl-checkbox ?disabled=${disabled} name="checkbox" required value="checked">Checkbox</sl-checkbox>
       </sl-form-field>
 
       <sl-form-field hint="Hint text" label="Checkbox group">
-        <sl-checkbox-group name="checkboxGroup" required>
+        <sl-checkbox-group ?disabled=${disabled} name="checkboxGroup" required>
           <sl-checkbox value="0">Check me</sl-checkbox>
           <sl-checkbox value="1">No me</sl-checkbox>
           <sl-checkbox value="2">I was here first</sl-checkbox>
@@ -179,7 +180,7 @@ export const All: Story = {
       </sl-form-field>
 
       <sl-form-field hint="Hint text" label="Combobox single">
-        <sl-combobox name="comboboxSingle" placeholder="Single select" required>
+        <sl-combobox ?disabled=${disabled} name="comboboxSingle" placeholder="Single select" required>
           <sl-listbox>
             <sl-option>Option 1</sl-option>
             <sl-option>Option 2</sl-option>
@@ -190,7 +191,7 @@ export const All: Story = {
       </sl-form-field>
 
       <sl-form-field hint="Hint text" label="Combobox multiple">
-        <sl-combobox name="comboboxMultiple" multiple placeholder="Multiple select" required>
+        <sl-combobox ?disabled=${disabled} name="comboboxMultiple" multiple placeholder="Multiple select" required>
           <sl-listbox>
             <sl-option>Option 1</sl-option>
             <sl-option>Option 2</sl-option>
@@ -201,7 +202,7 @@ export const All: Story = {
       </sl-form-field>
 
       <sl-form-field hint="Hint text" label="Radio group">
-        <sl-radio-group name="radioGroup" required>
+        <sl-radio-group ?disabled=${disabled} name="radioGroup" required>
           <sl-radio value="1">One</sl-radio>
           <sl-radio value="2">Two</sl-radio>
           <sl-radio value="3">Three</sl-radio>
@@ -209,7 +210,7 @@ export const All: Story = {
       </sl-form-field>
 
       <sl-form-field hint="Hint text" label="Select">
-        <sl-select name="select" required>
+        <sl-select ?disabled=${disabled} name="select" required>
           <sl-option value="1">Option 1</sl-option>
           <sl-option value="2">Option 2</sl-option>
           <sl-option value="3">Option 3</sl-option>
@@ -217,12 +218,19 @@ export const All: Story = {
       </sl-form-field>
 
       <sl-form-field hint="Hint text" label="Switch">
-        <sl-switch name="switch" reverse value="toggled">Toggle me</sl-switch>
+        <sl-switch ?disabled=${disabled} name="switch" reverse value="toggled">Toggle me</sl-switch>
       </sl-form-field>
     `
   }
 };
 
+export const AllDisabled: Story = {
+  args: {
+    ...All.args,
+    disabled: true
+  }
+};
+
 export const AllInvalid: Story = {
   args: {
     ...All.args,
diff --git a/packages/components/form/src/label.scss b/packages/components/form/src/label.scss
index 0b0b9ef352..b44a627b6f 100644
--- a/packages/components/form/src/label.scss
+++ b/packages/components/form/src/label.scss
@@ -5,10 +5,6 @@
   font-weight: var(--sl-text-typeset-fontWeight-demibold);
 }
 
-:host([disabled]) {
-  color: var(--sl-color-foreground-disabled);
-}
-
 .optional,
 .required {
   margin-inline-start: var(--sl-size-050);
diff --git a/packages/components/grid/src/grid.scss b/packages/components/grid/src/grid.scss
index 66e94e99f4..ece93d26c3 100644
--- a/packages/components/grid/src/grid.scss
+++ b/packages/components/grid/src/grid.scss
@@ -2,7 +2,7 @@
 :host {
   --_border: var(--_border-width) solid var(--_border-color);
   --_border-color: var(--sl-color-border-plain);
-  --_border-width: var(--sl-size-borderWidth-subtle);
+  --_border-width: var(--sl-size-borderWidth-default);
   --_border-radius: var(--sl-size-borderRadius-default);
   --_cell-background: var(--sl-elevation-surface-raised-default-idle);
   --_cell-border: var(--_border-width) solid var(--_border-color);
@@ -100,8 +100,8 @@
   sl-scrollbar::before {
     background: var(--sl-color-grid-border);
     content: '';
-    inline-size: var(--sl-size-borderWidth-subtle);
-    inset: 0 auto 0 calc(var(--sl-size-borderWidth-subtle) * -1);
+    inline-size: var(--sl-size-borderWidth-default);
+    inset: 0 auto 0 calc(var(--sl-size-borderWidth-default) * -1);
     position: absolute;
   }
 }
@@ -138,8 +138,8 @@
   sl-scrollbar::after {
     background: var(--sl-color-grid-border);
     content: '';
-    inline-size: var(--sl-size-borderWidth-subtle);
-    inset: 0 calc(var(--sl-size-borderWidth-subtle) * -1) 0 auto;
+    inline-size: var(--sl-size-borderWidth-default);
+    inset: 0 calc(var(--sl-size-borderWidth-default) * -1) 0 auto;
     position: absolute;
   }
 }
@@ -171,7 +171,7 @@ thead {
   border-start-end-radius: var(--_border-radius);
   border-start-start-radius: var(--_border-radius);
   inset-block-start: 0;
-  max-inline-size: calc(var(--sl-grid-width) - var(--sl-size-borderWidth-subtle) * 2);
+  max-inline-size: calc(var(--sl-grid-width) - var(--sl-size-borderWidth-default) * 2);
   overflow-x: hidden;
   position: sticky;
   z-index: 1;
@@ -179,7 +179,7 @@ thead {
 
 tbody {
   background-color: var(--sl-elevation-surface-raised-default-idle);
-  max-inline-size: calc(var(--sl-grid-width) - var(--sl-size-borderWidth-subtle) * 2);
+  max-inline-size: calc(var(--sl-grid-width) - var(--sl-size-borderWidth-default) * 2);
   min-block-size: calc(var(--sl-grid-tbody-min-height) + var(--_border-width));
   overflow: auto clip;
   overscroll-behavior: contain auto;
@@ -406,14 +406,14 @@ a[class^='skip-link'] {
 
 tfoot {
   inset-block-end: 0;
-  max-inline-size: calc(var(--sl-grid-width) - var(--sl-size-borderWidth-subtle) * 2);
+  max-inline-size: calc(var(--sl-grid-width) - var(--sl-size-borderWidth-default) * 2);
   overflow: hidden;
   position: sticky;
 
   td {
     display: flex;
     flex: 1;
-    max-inline-size: calc(var(--sl-grid-width) - var(--sl-size-borderWidth-subtle) * 2);
+    max-inline-size: calc(var(--sl-grid-width) - var(--sl-size-borderWidth-default) * 2);
     padding: 0 !important;
   }
 
diff --git a/packages/components/listbox/src/listbox.scss b/packages/components/listbox/src/listbox.scss
index 7474c5f16f..017ba5aa98 100644
--- a/packages/components/listbox/src/listbox.scss
+++ b/packages/components/listbox/src/listbox.scss
@@ -12,7 +12,7 @@
 
 ::slotted(hr) {
   border: 0;
-  border-block-start: var(--sl-color-border-plain) solid var(--sl-size-borderWidth-subtle);
+  border-block-start: var(--sl-color-border-plain) solid var(--sl-size-borderWidth-default);
   margin: var(--sl-size-075) 0;
   padding: 0;
 }
diff --git a/packages/components/listbox/src/option-group-header.scss b/packages/components/listbox/src/option-group-header.scss
index 82240b13c3..271438b61a 100644
--- a/packages/components/listbox/src/option-group-header.scss
+++ b/packages/components/listbox/src/option-group-header.scss
@@ -10,7 +10,7 @@
 }
 
 .divider {
-  border-block-start: var(--sl-color-elevation-border-raised) solid var(--sl-size-borderWidth-subtle);
+  border-block-start: var(--sl-color-elevation-border-raised) solid var(--sl-size-borderWidth-default);
   margin-block-start: var(--sl-size-100);
   padding-block-start: var(--sl-size-100);
 }
diff --git a/packages/components/listbox/src/option-group.scss b/packages/components/listbox/src/option-group.scss
index b39f89e055..e4607c6d42 100644
--- a/packages/components/listbox/src/option-group.scss
+++ b/packages/components/listbox/src/option-group.scss
@@ -5,7 +5,7 @@
 }
 
 :host(:not(:first-of-type)) {
-  border-block-start: var(--sl-color-border-plain) solid var(--sl-size-borderWidth-subtle);
+  border-block-start: var(--sl-color-border-plain) solid var(--sl-size-borderWidth-default);
   margin-block-start: var(--sl-size-075);
   padding-block-start: var(--sl-size-100);
 }
diff --git a/packages/components/menu/src/menu-item.scss b/packages/components/menu/src/menu-item.scss
index cebfc225c9..879ccf6289 100644
--- a/packages/components/menu/src/menu-item.scss
+++ b/packages/components/menu/src/menu-item.scss
@@ -111,5 +111,5 @@ sl-icon[name='chevron-right'] {
 
 slot[name='submenu']::slotted(sl-menu) {
   // Make sure the first menu item in the nested menu aligns horizontally
-  margin-block-start: calc((var(--sl-size-100) + var(--sl-size-borderWidth-subtle)) * -1);
+  margin-block-start: calc((var(--sl-size-100) + var(--sl-size-borderWidth-default)) * -1);
 }
diff --git a/packages/components/menu/src/menu.scss b/packages/components/menu/src/menu.scss
index 4fafb69a68..442f35292e 100644
--- a/packages/components/menu/src/menu.scss
+++ b/packages/components/menu/src/menu.scss
@@ -1,6 +1,6 @@
 :host {
   background: var(--sl-elevation-surface-base-default);
-  border: var(--sl-color-border-plain) solid var(--sl-size-borderWidth-subtle);
+  border: var(--sl-size-borderWidth-default) solid var(--sl-color-border-plain);
   border-radius: var(--sl-size-borderRadius-default);
   box-shadow: var(--sl-elevation-shadow-md);
   box-sizing: border-box;
@@ -103,14 +103,14 @@
 }
 
 ::slotted(sl-menu-item-group:not(:first-child)) {
-  border-block-start: var(--sl-color-border-plain) solid var(--sl-size-borderWidth-subtle);
+  border-block-start: var(--sl-size-borderWidth-default) solid var(--sl-color-border-plain);
   margin-block-start: var(--sl-size-075);
   padding-block-start: var(--sl-size-100);
 }
 
 ::slotted(hr) {
   border: 0;
-  border-block-start: var(--sl-color-border-plain) solid var(--sl-size-borderWidth-subtle);
+  border-block-start: var(--sl-size-borderWidth-default) solid var(--sl-color-border-plain);
   margin: var(--sl-size-075) 0;
   padding: 0;
 }
diff --git a/packages/components/panel/src/panel.scss b/packages/components/panel/src/panel.scss
index 290fc69d51..6ea9015a7b 100644
--- a/packages/components/panel/src/panel.scss
+++ b/packages/components/panel/src/panel.scss
@@ -3,7 +3,7 @@
   --sl-panel-titles-order: column;
 
   background: var(--sl-elevation-surface-raised-default-idle);
-  border: var(--sl-color-border-bold) solid var(--sl-size-borderWidth-subtle);
+  border: var(--sl-color-border-bold) solid var(--sl-size-borderWidth-default);
   border-radius: var(--sl-size-borderRadius-md);
   display: flex;
   flex-direction: column;
diff --git a/packages/components/popover/src/popover.scss b/packages/components/popover/src/popover.scss
index 7bfe79806c..986854ac37 100644
--- a/packages/components/popover/src/popover.scss
+++ b/packages/components/popover/src/popover.scss
@@ -3,7 +3,7 @@
   --_arrow-inline-size: var(--sl-size-200);
 
   background: var(--sl-elevation-surface-raised-default);
-  border: var(--sl-size-borderWidth-subtle) solid var(--sl-color-border-plain);
+  border: var(--sl-size-borderWidth-default) solid var(--sl-color-border-plain);
   border-radius: var(--sl-size-borderRadius-default);
   box-shadow: var(--sl-elevation-shadow-overlay);
   box-sizing: border-box;
@@ -27,7 +27,7 @@
    */
   @supports not selector(:popover-open) {
     background: var(--sl-elevation-surface-raised-default) !important;
-    border: var(--sl-size-borderWidth-subtle) solid var(--sl-color-border-plain) !important;
+    border: var(--sl-size-borderWidth-default) solid var(--sl-color-border-plain) !important;
     color: var(--sl-color-foreground-plain) !important;
     margin: 0 !important;
     overflow: visible !important;
diff --git a/packages/components/radio-group/src/radio.scss b/packages/components/radio-group/src/radio.scss
index 1cdc99d67e..1d9edbdff4 100644
--- a/packages/components/radio-group/src/radio.scss
+++ b/packages/components/radio-group/src/radio.scss
@@ -108,7 +108,7 @@
   aspect-ratio: 1;
   background: color-mix(in srgb, var(--_bg-color), var(--_bg-mix-color) calc(100% * var(--_bg-opacity)));
   block-size: var(--sl-size-300);
-  border: var(--sl-size-borderWidth-subtle) solid var(--_border);
+  border: var(--sl-size-borderWidth-default) solid var(--_border);
   border-radius: 50%;
   box-sizing: border-box;
   display: inline-flex;
diff --git a/packages/components/select/src/select-button.scss b/packages/components/select/src/select-button.scss
index 781673421e..d90176bfe2 100644
--- a/packages/components/select/src/select-button.scss
+++ b/packages/components/select/src/select-button.scss
@@ -5,7 +5,7 @@
 
   align-items: center;
   background: color-mix(in srgb, var(--_bg-color), var(--_bg-mix-color) calc(100% * var(--_bg-opacity)));
-  border: var(--sl-size-borderWidth-subtle) solid var(--sl-color-border-input);
+  border: var(--sl-size-borderWidth-default) solid var(--sl-color-border-input);
   border-radius: var(--sl-size-borderRadius-default);
   color: var(--sl-color-foreground-plain);
   cursor: pointer;
@@ -15,7 +15,7 @@
   min-inline-size: 0;
   outline: transparent solid var(--sl-size-outlineWidth-default);
   outline-offset: var(--sl-size-outlineOffset-default);
-  padding-inline-end: calc(var(--sl-size-150) - var(--sl-size-borderWidth-subtle));
+  padding-inline-end: calc(var(--sl-size-150) - var(--sl-size-borderWidth-default));
 
   @media (prefers-reduced-motion: no-preference) {
     transition: 0.2s ease-in-out;
@@ -70,18 +70,18 @@
 
 :host([clearable]) {
   button + .status {
-    border-inline-start: var(--sl-size-borderWidth-subtle) solid var(--sl-color-border-neutral-subtle);
+    border-inline-start: var(--sl-size-borderWidth-default) solid var(--sl-color-border-neutral-subtle);
     margin-inline-start: 0;
-    padding-inline-start: calc(var(--sl-size-100) - var(--sl-size-borderWidth-subtle));
+    padding-inline-start: calc(var(--sl-size-100) - var(--sl-size-borderWidth-default));
   }
 }
 
 :host([size='lg']) {
-  padding-inline-end: calc(var(--sl-size-200) - var(--sl-size-borderWidth-subtle));
+  padding-inline-end: calc(var(--sl-size-200) - var(--sl-size-borderWidth-default));
 
   div {
-    padding-block: calc(var(--sl-size-175) - var(--sl-size-borderWidth-subtle));
-    padding-inline-start: calc(var(--sl-size-200) - var(--sl-size-borderWidth-subtle));
+    padding-block: calc(var(--sl-size-175) - var(--sl-size-borderWidth-default));
+    padding-inline-start: calc(var(--sl-size-200) - var(--sl-size-borderWidth-default));
   }
 
   button {
@@ -96,8 +96,8 @@
 div {
   flex: 1;
   overflow: hidden;
-  padding-block: calc(var(--sl-size-100) - var(--sl-size-borderWidth-subtle));
-  padding-inline-start: calc(var(--sl-size-150) - var(--sl-size-borderWidth-subtle));
+  padding-block: calc(var(--sl-size-100) - var(--sl-size-borderWidth-default));
+  padding-inline-start: calc(var(--sl-size-150) - var(--sl-size-borderWidth-default));
   pointer-events: none;
   text-overflow: ellipsis;
   white-space: nowrap;
@@ -129,7 +129,7 @@ button {
   appearance: none;
   aspect-ratio: 1;
   background: transparent;
-  block-size: calc(1lh + (var(--sl-size-100) - var(--sl-size-borderWidth-subtle)) * 2);
+  block-size: calc(1lh + (var(--sl-size-100) - var(--sl-size-borderWidth-default)) * 2);
   border: 0;
   cursor: pointer;
   display: inline-grid;
diff --git a/packages/components/select/src/select.scss b/packages/components/select/src/select.scss
index d1fb09ac43..7ac455baf2 100644
--- a/packages/components/select/src/select.scss
+++ b/packages/components/select/src/select.scss
@@ -5,7 +5,7 @@
 
 sl-listbox {
   background: var(--sl-elevation-surface-raised-default);
-  border: var(--sl-size-borderWidth-subtle) solid var(--sl-color-border-plain);
+  border: var(--sl-size-borderWidth-default) solid var(--sl-color-border-plain);
   border-radius: var(--sl-size-borderRadius-default);
   box-shadow: var(--sl-elevation-shadow-overlay);
   box-sizing: border-box;
diff --git a/packages/components/switch/src/switch.scss b/packages/components/switch/src/switch.scss
index b8e3ac7942..b2a0f0823f 100644
--- a/packages/components/switch/src/switch.scss
+++ b/packages/components/switch/src/switch.scss
@@ -1,7 +1,7 @@
 :host {
-  --_bg-color: var(--sl-color-background-neutral-subtle);
-  --_bg-mix-color: var(--sl-color-background-neutral-interactive-plain);
-  --_bg-opacity: var(--sl-opacity-interactive-plain-idle);
+  --_bg-color: var(--sl-color-border-bold);
+  --_bg-mix-color: var(--sl-color-background-neutral-interactive-bold);
+  --_bg-opacity: var(--sl-opacity-interactive-bold-idle);
   --_handle-color: var(--sl-color-foreground-neutral-plain);
   --_handle-size: var(--sl-size-250);
   --_icon-size: var(--sl-size-150);
@@ -17,19 +17,23 @@
 }
 
 :host(:hover) {
-  --_bg-opacity: var(--sl-opacity-interactive-plain-hover);
+  --_bg-opacity: var(--sl-opacity-interactive-bold-hover);
 }
 
 :host(:active) {
-  --_bg-opacity: var(--sl-opacity-interactive-plain-active);
+  --_bg-opacity: var(--sl-opacity-interactive-bold-active);
 }
 
 :host([checked]) {
-  --_bg-color: var(--sl-color-background-positive-bold);
-  --_bg-mix-color: var(--sl-color-background-positive-interactive-bold);
+  --_bg-color: var(--sl-color-background-selected-bold);
+  --_bg-mix-color: var(--sl-color-background-selected-interactive-bold);
   --_bg-opacity: var(--sl-opacity-interactive-bold-idle);
-  --_handle-color: var(--sl-color-foreground-positive-bold);
+  --_handle-color: var(--sl-color-foreground-selected-plain);
   --_handle-position: calc(var(--_track-size) - var(--_handle-size) - var(--sl-size-025) * 2);
+
+  [part='track'] {
+    border-color: var(--sl-color-border-selected);
+  }
 }
 
 :host([checked]:hover) {
@@ -49,6 +53,7 @@
 
   [part='track'] {
     background: var(--sl-color-background-disabled);
+    border-color: var(--sl-color-border-disabled);
   }
 }
 
@@ -86,13 +91,14 @@
 
 [part='track'] {
   background: color-mix(in srgb, var(--_bg-color), var(--_bg-mix-color) calc(100% * var(--_bg-opacity)));
+  border: var(--sl-size-borderWidth-default) solid var(--sl-color-border-bold);
   border-radius: calc((var(--_handle-size) + var(--sl-size-025) * 2) / 2);
   box-sizing: border-box;
   display: grid;
   inline-size: var(--_track-size);
   outline: transparent solid var(--sl-size-outlineWidth-default);
   outline-offset: var(--sl-size-outlineOffset-default);
-  padding: var(--sl-size-025);
+  padding: calc(var(--sl-size-025) - var(--sl-size-borderWidth-default));
 
   @media (prefers-reduced-motion: no-preference) {
     transition: 200ms ease-in-out;
@@ -105,6 +111,7 @@
   background: var(--sl-color-background-inverted-bold);
   block-size: var(--_handle-size);
   border-radius: 50%;
+  box-shadow: var(--sl-elevation-shadow-overlay);
   color: var(--_handle-color);
   display: grid;
   place-content: center;
diff --git a/packages/components/switch/src/switch.stories.ts b/packages/components/switch/src/switch.stories.ts
index e645a8d83c..2284209a64 100644
--- a/packages/components/switch/src/switch.stories.ts
+++ b/packages/components/switch/src/switch.stories.ts
@@ -1,4 +1,4 @@
-import { faRabbitRunning, faTurtle } from '@fortawesome/pro-regular-svg-icons';
+import { faMoonStars, faSunBright } from '@fortawesome/pro-solid-svg-icons';
 import '@sl-design-system/button/register.js';
 import '@sl-design-system/button-bar/register.js';
 import '@sl-design-system/form/register.js';
@@ -15,7 +15,7 @@ type Props = Pick<Switch, 'checked' | 'disabled' | 'reverse' | 'size' | 'value'>
 };
 type Story = StoryObj<Props>;
 
-Icon.register(faTurtle, faRabbitRunning);
+Icon.register(faMoonStars, faSunBright);
 
 export default {
   title: 'Form/Switch',
@@ -87,9 +87,9 @@ export const Reverse: Story = {
 export const CustomIcons: Story = {
   render: () => {
     return html`
-      <sl-switch size="sm" icon-off="far-turtle" icon-on="far-rabbit-running"></sl-switch>
-      <sl-switch icon-off="far-turtle" icon-on="far-rabbit-running"></sl-switch>
-      <sl-switch size="lg" icon-off="far-turtle" icon-on="far-rabbit-running"></sl-switch>
+      <sl-switch size="sm" icon-off="fas-sun-bright" icon-on="fas-moon-stars"></sl-switch>
+      <sl-switch icon-off="fas-sun-bright" icon-on="fas-moon-stars"></sl-switch>
+      <sl-switch size="lg" icon-off="fas-sun-bright" icon-on="fas-moon-stars"></sl-switch>
     `;
   }
 };
@@ -147,12 +147,12 @@ export const All: Story = {
         <sl-switch checked size="lg">Checked</sl-switch>
 
         <span style="justify-self: start">Custom</span>
-        <sl-switch icon-off="far-turtle" icon-on="far-rabbit-running" size="sm">Unchecked</sl-switch>
-        <sl-switch checked icon-off="far-turtle" icon-on="far-rabbit-running" size="sm">Checked</sl-switch>
-        <sl-switch icon-off="far-turtle" icon-on="far-rabbit-running">Unchecked</sl-switch>
-        <sl-switch checked icon-off="far-turtle" icon-on="far-rabbit-running">Checked</sl-switch>
-        <sl-switch icon-off="far-turtle" icon-on="far-rabbit-running" size="lg">Unchecked</sl-switch>
-        <sl-switch checked icon-off="far-turtle" icon-on="far-rabbit-running" size="lg">Checked</sl-switch>
+        <sl-switch icon-off="fas-sun-bright" icon-on="fas-moon-stars" size="sm">Unchecked</sl-switch>
+        <sl-switch checked icon-off="fas-sun-bright" icon-on="fas-moon-stars" size="sm">Checked</sl-switch>
+        <sl-switch icon-off="fas-sun-bright" icon-on="fas-moon-stars">Unchecked</sl-switch>
+        <sl-switch checked icon-off="fas-sun-bright" icon-on="fas-moon-stars">Checked</sl-switch>
+        <sl-switch icon-off="fas-sun-bright" icon-on="fas-moon-stars" size="lg">Unchecked</sl-switch>
+        <sl-switch checked icon-off="fas-sun-bright" icon-on="fas-moon-stars" size="lg">Checked</sl-switch>
 
         <span style="justify-self: start">Reverse</span>
         <sl-switch reverse size="sm">Unchecked</sl-switch>
diff --git a/packages/components/tabs/src/tab-group.scss b/packages/components/tabs/src/tab-group.scss
index a5f0a73d35..c8e3a43181 100644
--- a/packages/components/tabs/src/tab-group.scss
+++ b/packages/components/tabs/src/tab-group.scss
@@ -151,7 +151,7 @@
   justify-content: inherit;
   overflow: scroll clip;
   overscroll-behavior-x: contain;
-  scroll-behavior: instant;
+  scroll-behavior: auto;
   scroll-snap-points-x: repeat(100%);
   scroll-snap-type: x mandatory;
   scrollbar-width: none;
diff --git a/packages/components/text-area/src/text-area.scss b/packages/components/text-area/src/text-area.scss
index 4d34447b71..78033d45ae 100644
--- a/packages/components/text-area/src/text-area.scss
+++ b/packages/components/text-area/src/text-area.scss
@@ -6,7 +6,7 @@
 
   align-items: start;
   background: color-mix(in srgb, var(--_bg-color), var(--_bg-mix-color) calc(100% * var(--_bg-opacity)));
-  border: var(--sl-size-borderWidth-subtle) solid var(--_border);
+  border: var(--sl-size-borderWidth-default) solid var(--_border);
   border-radius: var(--sl-size-borderRadius-default);
   color: var(--sl-color-foreground-plain);
   cursor: text;
@@ -39,14 +39,14 @@
 
 :host([size='lg']) {
   ::slotted(textarea) {
-    padding-block: calc(var(--sl-size-175) - var(--sl-size-borderWidth-subtle));
-    padding-inline: calc(var(--sl-size-200) - var(--sl-size-borderWidth-subtle));
+    padding-block: calc(var(--sl-size-175) - var(--sl-size-borderWidth-default));
+    padding-inline: calc(var(--sl-size-200) - var(--sl-size-borderWidth-default));
   }
 
   sl-icon,
   slot[name='suffix']::slotted(sl-icon) {
-    inset-block-start: calc(var(--sl-size-200) - var(--sl-size-borderWidth-subtle));
-    inset-inline-end: calc(var(--sl-size-200) - var(--sl-size-borderWidth-subtle));
+    inset-block-start: calc(var(--sl-size-200) - var(--sl-size-borderWidth-default));
+    inset-inline-end: calc(var(--sl-size-200) - var(--sl-size-borderWidth-default));
   }
 }
 
@@ -74,8 +74,8 @@ slot[name='textarea']::slotted(textarea) {
   margin: 0;
   min-block-size: calc(var(--sl-text-area-rows, 3) * 1lh);
   outline: none;
-  padding-block: calc(var(--sl-size-100) - var(--sl-size-borderWidth-subtle));
-  padding-inline: calc(var(--sl-size-150) - var(--sl-size-borderWidth-subtle));
+  padding-block: calc(var(--sl-size-100) - var(--sl-size-borderWidth-default));
+  padding-inline: calc(var(--sl-size-150) - var(--sl-size-borderWidth-default));
 
   &:focus {
     outline: none;
@@ -89,8 +89,8 @@ slot[name='textarea']::slotted(textarea) {
 
 sl-icon,
 slot[name='suffix']::slotted(sl-icon) {
-  inset-block-start: calc(var(--sl-size-125) - var(--sl-size-borderWidth-subtle));
-  inset-inline-end: calc(var(--sl-size-150) - var(--sl-size-borderWidth-subtle));
+  inset-block-start: calc(var(--sl-size-125) - var(--sl-size-borderWidth-default));
+  inset-inline-end: calc(var(--sl-size-150) - var(--sl-size-borderWidth-default));
   position: absolute;
 }
 
diff --git a/packages/components/text-field/src/text-field.scss b/packages/components/text-field/src/text-field.scss
index 70939bc729..4f8215e0aa 100644
--- a/packages/components/text-field/src/text-field.scss
+++ b/packages/components/text-field/src/text-field.scss
@@ -2,11 +2,10 @@
   --_bg-color: var(--sl-color-background-input-plain);
   --_bg-mix-color: var(--sl-color-background-input-interactive);
   --_bg-opacity: var(--sl-opacity-light-interactive-plain-idle);
-  --_border: var(--sl-color-border-input);
 
   align-items: center;
   background: color-mix(in srgb, var(--_bg-color), var(--_bg-mix-color) calc(100% * var(--_bg-opacity)));
-  border: var(--sl-size-borderWidth-subtle) solid var(--_border);
+  border: var(--sl-size-borderWidth-default) solid var(--sl-color-border-input);
   border-radius: var(--sl-size-borderRadius-default);
   box-sizing: border-box;
   color: var(--sl-color-foreground-plain);
@@ -15,32 +14,34 @@
   gap: var(--sl-size-100);
   outline: transparent solid var(--sl-size-outlineWidth-default);
   outline-offset: var(--sl-size-outlineOffset-default);
-  padding-inline-start: calc(var(--sl-size-150) - var(--sl-size-borderWidth-subtle));
+  padding-inline-start: calc(var(--sl-size-150) - var(--sl-size-borderWidth-default));
   vertical-align: middle;
 }
 
 :host([show-validity='invalid']) {
   --_bg-color: var(--sl-color-background-input-plain);
   --_bg-mix-color: var(--sl-color-background-negative-interactive-plain);
-  --_border: var(--sl-color-border-negative-plain);
+
+  border-color: var(--sl-color-border-negative-plain);
 }
 
 :host([show-validity='valid']) {
   --_bg-color: var(--sl-color-background-input-plain);
   --_bg-mix-color: var(--sl-color-background-positive-interactive-plain);
-  --_border: var(--sl-color-border-positive-plain);
+
+  border-color: var(--sl-color-border-positive-plain);
 }
 
 :host([size='lg']) {
-  padding-inline-start: calc(var(--sl-size-200) - var(--sl-size-borderWidth-subtle));
+  padding-inline-start: calc(var(--sl-size-200) - var(--sl-size-borderWidth-default));
 
   ::slotted(input) {
-    padding-block: calc(var(--sl-size-175) - var(--sl-size-borderWidth-subtle));
+    padding-block: calc(var(--sl-size-175) - var(--sl-size-borderWidth-default));
   }
 
   .valid,
   slot[name='suffix']::slotted(:not(sl-field-button)) {
-    padding-inline-end: calc(var(--sl-size-175) - var(--sl-size-borderWidth-subtle));
+    padding-inline-end: calc(var(--sl-size-175) - var(--sl-size-borderWidth-default));
   }
 }
 
@@ -70,7 +71,7 @@
 }
 
 slot[name='suffix']::slotted(:not(sl-field-button)) {
-  padding-inline-end: calc(var(--sl-size-150) - var(--sl-size-borderWidth-subtle));
+  padding-inline-end: calc(var(--sl-size-150) - var(--sl-size-borderWidth-default));
 }
 
 slot[name='input']::slotted(input) {
@@ -83,7 +84,7 @@ slot[name='input']::slotted(input) {
   margin: 0;
   min-inline-size: 0;
   outline: none;
-  padding-block: calc(var(--sl-size-100) - var(--sl-size-borderWidth-subtle));
+  padding-block: calc(var(--sl-size-100) - var(--sl-size-borderWidth-default));
   padding-inline: 0;
 
   &:focus {
@@ -98,5 +99,5 @@ slot[name='input']::slotted(input) {
 
 .valid {
   color: var(--sl-color-foreground-positive-plain);
-  padding-inline-end: calc(var(--sl-size-150) - var(--sl-size-borderWidth-subtle));
+  padding-inline-end: calc(var(--sl-size-150) - var(--sl-size-borderWidth-default));
 }
diff --git a/packages/components/tree/src/indent-guides.scss b/packages/components/tree/src/indent-guides.scss
index f42f38052e..8c00cd9637 100644
--- a/packages/components/tree/src/indent-guides.scss
+++ b/packages/components/tree/src/indent-guides.scss
@@ -16,9 +16,9 @@
 
   &::before {
     block-size: 100%;
-    border-block-end: var(--sl-size-borderWidth-subtle) solid currentcolor;
+    border-block-end: var(--sl-size-borderWidth-default) solid currentcolor;
     border-end-start-radius: var(--sl-size-050);
-    border-inline-start: var(--sl-size-borderWidth-subtle) solid currentcolor;
+    border-inline-start: var(--sl-size-borderWidth-default) solid currentcolor;
     content: '';
     inline-size: var(--sl-size-050);
     inset: 100% auto auto 0;
@@ -28,6 +28,6 @@
 
 [part='guide'] {
   background: currentcolor;
-  inline-size: var(--sl-size-borderWidth-subtle);
+  inline-size: var(--sl-size-borderWidth-default);
   margin-inline-start: var(--sl-size-150);
 }
diff --git a/packages/tokens/src/bingel-dc/base-new.json b/packages/tokens/src/bingel-dc/base-new.json
index fcc8d8ce68..408fe9563a 100644
--- a/packages/tokens/src/bingel-dc/base-new.json
+++ b/packages/tokens/src/bingel-dc/base-new.json
@@ -131,7 +131,7 @@
     },
     "borderWidth": {
       "default": {
-        "value": "{size.borderWidth.bold}",
+        "value": "{size.borderWidth.subtle}",
         "type": "borderWidth",
         "description": "Sets the standard border width for UI elements."
       },
diff --git a/packages/tokens/src/bingel-dc/light-new.json b/packages/tokens/src/bingel-dc/light-new.json
index 55e1503ccc..d6d0845f11 100644
--- a/packages/tokens/src/bingel-dc/light-new.json
+++ b/packages/tokens/src/bingel-dc/light-new.json
@@ -1042,7 +1042,7 @@
           "description": "Use for backgrounds of form UI elements, such as text fields, checkboxes, and radio buttons."
         },
         "interactive": {
-          "value": "{color.background.accent.blue.interactive.plain}",
+          "value": "{color.background.accent.grey.interactive.plain}",
           "type": "color",
           "description": "Used as transparent layer on top of the input background to indicate the hover state."
         }
@@ -1147,7 +1147,7 @@
         },
         "interactive": {
           "bold": {
-            "value": "{color.background.accent.grey.interactive.bold}",
+            "value": "{color.palette.grey.700}",
             "type": "color",
             "description": "Used as transparent layer on top of the bold background to indicate the hover and pressed state."
           },
diff --git a/packages/tokens/src/bingel-int/base-new.json b/packages/tokens/src/bingel-int/base-new.json
index 45aae2bb3d..575ffa6217 100644
--- a/packages/tokens/src/bingel-int/base-new.json
+++ b/packages/tokens/src/bingel-int/base-new.json
@@ -119,7 +119,7 @@
     },
     "borderRadius": {
       "default": {
-        "value": "{border.radius.xs}",
+        "value": "{border.radius.2xs}",
         "type": "borderRadius",
         "description": "The standard border radius for most components. Use for elements that need subtle rounding without emphasizing their shape."
       },
diff --git a/packages/tokens/src/bingel-int/light-new.json b/packages/tokens/src/bingel-int/light-new.json
index 0bf7710be9..d6d0845f11 100644
--- a/packages/tokens/src/bingel-int/light-new.json
+++ b/packages/tokens/src/bingel-int/light-new.json
@@ -1147,7 +1147,7 @@
         },
         "interactive": {
           "bold": {
-            "value": "{color.background.accent.grey.interactive.bold}",
+            "value": "{color.palette.grey.700}",
             "type": "color",
             "description": "Used as transparent layer on top of the bold background to indicate the hover and pressed state."
           },
diff --git a/packages/tokens/src/clickedu/light-new.json b/packages/tokens/src/clickedu/light-new.json
index 497244a9f2..8302144449 100644
--- a/packages/tokens/src/clickedu/light-new.json
+++ b/packages/tokens/src/clickedu/light-new.json
@@ -701,7 +701,7 @@
           "description": "Use for text in selected states (e.g., tabs or menu items)."
         },
         "plain": {
-          "value": "{color.foreground.accent.blue.plain}",
+          "value": "{color.foreground.accent.purple.plain}",
           "type": "color",
           "description": "Used as selected foreground color on white backgrounds."
         }
@@ -1142,7 +1142,7 @@
         },
         "interactive": {
           "bold": {
-            "value": "{color.background.accent.grey.interactive.bold}",
+            "value": "{color.palette.grey.800}",
             "type": "color",
             "description": "Used as transparent layer on top of the bold background to indicate the hover and pressed state."
           },
@@ -1340,7 +1340,7 @@
             "description": "A subtle grey background option in idle state, applied purely for stylistic purposes without specific meaning."
           },
           "bold": {
-            "value": "{color.palette.grey.150}",
+            "value": "{color.palette.grey.050}",
             "type": "color",
             "description": "A vibrant grey background option, applied purely for stylistic purposes without specific meaning."
           },
@@ -1351,7 +1351,7 @@
               "description": "Used as transparent layer on top of the bold background to indicate the hover and pressed state."
             },
             "plain": {
-              "value": "{color.palette.grey.800}",
+              "value": "{color.palette.grey.300}",
               "type": "color",
               "description": "Used as transparent layer on top of the muted, subtlest and subtle background to indicate the hover and pressed state."
             }
diff --git a/packages/tokens/src/editorial-suite/light-new.json b/packages/tokens/src/editorial-suite/light-new.json
index fac976f6c7..d93d83ea74 100644
--- a/packages/tokens/src/editorial-suite/light-new.json
+++ b/packages/tokens/src/editorial-suite/light-new.json
@@ -417,7 +417,7 @@
           "description": "Use for text in selected states (e.g., tabs or menu items)."
         },
         "plain": {
-          "value": "{color.foreground.accent.blue.plain}",
+          "value": "{color.foreground.accent.teal.plain}",
           "type": "color",
           "description": "Used as selected foreground color on white backgrounds."
         }
@@ -1142,7 +1142,7 @@
         },
         "interactive": {
           "bold": {
-            "value": "{color.background.accent.grey.interactive.bold}",
+            "value": "{color.palette.grey.800}",
             "type": "color",
             "description": "Used as transparent layer on top of the bold background to indicate the hover and pressed state."
           },
@@ -1351,7 +1351,7 @@
               "description": "Used as transparent layer on top of the bold background to indicate the hover and pressed state."
             },
             "plain": {
-              "value": "{color.palette.grey.600}",
+              "value": "{color.palette.grey.500}",
               "type": "color",
               "description": "Used as transparent layer on top of the muted, subtlest and subtle background to indicate the hover and pressed state."
             }
diff --git a/packages/tokens/src/itslearning/light-new.json b/packages/tokens/src/itslearning/light-new.json
index 00f5333f61..f80eb65c28 100644
--- a/packages/tokens/src/itslearning/light-new.json
+++ b/packages/tokens/src/itslearning/light-new.json
@@ -402,17 +402,17 @@
       },
       "selected": {
         "bold": {
-          "value": "{color.foreground.accent.green.bold}",
+          "value": "{color.foreground.accent.purple.bold}",
           "type": "color",
           "description": "Use for text in selected states (e.g., tabs or menu items)."
         },
         "onBold": {
-          "value": "{color.foreground.accent.green.onBold}",
+          "value": "{color.foreground.accent.purple.onBold}",
           "type": "color",
           "description": "Use for text in selected states (e.g., tabs or menu items)."
         },
         "plain": {
-          "value": "{color.foreground.accent.blue.plain}",
+          "value": "{color.foreground.accent.purple.plain}",
           "type": "color",
           "description": "Used as selected foreground color on white backgrounds."
         }
@@ -585,7 +585,7 @@
         },
         "grey": {
           "faint": {
-            "value": "{color.palette.grey.500}",
+            "value": "{color.palette.grey.600}",
             "type": "color",
             "description": "Use for faint text on neutral backgrounds, providing low contrast. Not intended for primary content, as it does not meet WCAG 2.2 AA contrast requirements. Use sparingly where accessibility isn't a critical concern."
           },
@@ -639,12 +639,12 @@
         },
         "purple": {
           "plain": {
-            "value": "{color.palette.purple.600}",
+            "value": "{color.palette.purple.800}",
             "type": "color",
             "description": "Use for purple text on neutral backgrounds for purely stylistic purposes with no specific meaning."
           },
           "bold": {
-            "value": "{color.palette.purple.700}",
+            "value": "{color.palette.purple.800}",
             "type": "color",
             "description": "Use for purple text on 'color.background.accent.purple.muted' or 'color.background.accent.purple.subtle', when used purely for stylistic purposes without specific meaning."
           },
@@ -742,7 +742,7 @@
       },
       "inverted": {
         "idle": {
-          "value": "{color.foreground.inverted}",
+          "value": "{color.foreground.inverted.plain}",
           "type": "color",
           "description": "Use for inverted links in idle state."
         },
@@ -802,7 +802,7 @@
         "description": "Use for focus rings of elements in a focus state."
       },
       "selected": {
-        "value": "{color.border.accent.purple.bold}",
+        "value": "{color.background.accent.purple.bold}",
         "type": "color",
         "description": "Use for borders that emphasize selected states, such as tabs or menu items."
       },
@@ -971,7 +971,7 @@
             "description": "Use for plain purple borders for purely stylistic purposes with no specific meaning."
           },
           "bold": {
-            "value": "{color.foreground.accent.purple.bold}",
+            "value": "{color.palette.purple.400}",
             "type": "color",
             "description": "Use for bold purple borders for purely stylistic purposes with no specific meaning."
           }
@@ -1026,7 +1026,7 @@
         "description": "Use for backgrounds of elements in a neutral state that require a bold emphasis or a minimum color contrast of 3:1, such as switch backgrounds."
       },
       "disabled": {
-        "value": "{color.palette.grey.200}",
+        "value": "{color.palette.grey.300}",
         "type": "color",
         "description": "Use for backgrounds of elements in disabled state."
       },
@@ -1044,23 +1044,23 @@
       },
       "selected": {
         "subtle": {
-          "value": "{color.background.accent.green.subtle}",
+          "value": "{color.background.accent.purple.subtle}",
           "type": "color",
           "description": "Use for backgrounds of elements in selected state with subtle emphasis, such as in opened dropdowns."
         },
         "bold": {
-          "value": "{color.background.accent.green.bold}",
+          "value": "{color.background.accent.purple.bold}",
           "type": "color",
           "description": "Use for backgrounds of elements in selected state with bold emphasis, such as in opened dropdowns."
         },
         "interactive": {
           "bold": {
-            "value": "{color.background.accent.green.interactive.bold}",
+            "value": "{color.background.accent.purple.interactive.bold}",
             "type": "color",
             "description": "Used as transparent layer on top of the bold background to indicate the hover and pressed state."
           },
           "plain": {
-            "value": "{color.background.accent.green.interactive.plain}",
+            "value": "{color.background.accent.purple.interactive.plain}",
             "type": "color",
             "description": "Used as transparent layer on top of the muted, subtlest and subtle background to indicate the hover and pressed state."
           }
@@ -1142,7 +1142,7 @@
         },
         "interactive": {
           "bold": {
-            "value": "{color.background.accent.grey.interactive.bold}",
+            "value": "{color.palette.grey.800}",
             "type": "color",
             "description": "Used as transparent layer on top of the bold background to indicate the hover and pressed state."
           },
diff --git a/packages/tokens/src/kampus/light-new.json b/packages/tokens/src/kampus/light-new.json
index 92ea163942..ee914f33a7 100644
--- a/packages/tokens/src/kampus/light-new.json
+++ b/packages/tokens/src/kampus/light-new.json
@@ -412,7 +412,7 @@
           "description": "Use for text in selected states (e.g., tabs or menu items)."
         },
         "plain": {
-          "value": "{color.foreground.accent.blue.plain}",
+          "value": "{color.foreground.accent.purple.plain}",
           "type": "color",
           "description": "Used as selected foreground color on white backgrounds."
         }
diff --git a/packages/tokens/src/my-digital-book/light-new.json b/packages/tokens/src/my-digital-book/light-new.json
index be39db72fa..985826ec2b 100644
--- a/packages/tokens/src/my-digital-book/light-new.json
+++ b/packages/tokens/src/my-digital-book/light-new.json
@@ -802,7 +802,7 @@
         "description": "Use for focus rings of elements in a focus state."
       },
       "selected": {
-        "value": "{color.border.primary.plain}",
+        "value": "{color.border.primary.bold}",
         "type": "color",
         "description": "Use for borders that emphasize selected states, such as tabs or menu items."
       },
diff --git a/packages/tokens/src/sanoma-learning/dark-new.json b/packages/tokens/src/sanoma-learning/dark-new.json
index 418e7462d0..10a99783d5 100644
--- a/packages/tokens/src/sanoma-learning/dark-new.json
+++ b/packages/tokens/src/sanoma-learning/dark-new.json
@@ -429,7 +429,7 @@
           "description": "Use for text in selected states (e.g., tabs or menu items)."
         },
         "onBold": {
-          "value": "{color.foreground.accent.blue.onBold}",
+          "value": "{color.palette.grey.000}",
           "type": "color",
           "description": "Use for text in selected states (e.g., tabs or menu items)."
         },
@@ -1071,13 +1071,13 @@
           "description": "Use for backgrounds of elements in selected state with subtle emphasis, such as in opened dropdowns."
         },
         "bold": {
-          "value": "{color.background.accent.blue.bold}",
+          "value": "{color.palette.blue.500}",
           "type": "color",
           "description": "Use for backgrounds of elements in selected state with bold emphasis, such as in opened dropdowns."
         },
         "interactive": {
           "bold": {
-            "value": "{color.background.accent.blue.interactive.bold}",
+            "value": "{color.palette.blue.700}",
             "type": "color",
             "description": "Used as transparent layer on top of the bold background to indicate the hover and pressed state."
           },
@@ -1169,7 +1169,7 @@
             "description": "Used as transparent layer on top of the bold background to indicate the hover and pressed state."
           },
           "plain": {
-            "value": "{color.background.accent.grey.interactive.plain}",
+            "value": "{color.palette.grey.200}",
             "type": "color",
             "description": "Used as transparent layer on top of the muted, subtlest and subtle background to indicate the hover and pressed state."
           }
@@ -1619,9 +1619,9 @@
         "value": {
           "x": "0",
           "y": "0",
-          "blur": "10",
+          "blur": "8",
           "spread": "0",
-          "color": "rgba({color.palette.grey.050}, {opacity.subtle})",
+          "color": "rgba( {color.palette.grey.000} , {opacity.subtle})",
           "type": "dropShadow"
         },
         "type": "boxShadow",
diff --git a/packages/tokens/src/sanoma-learning/light-new.json b/packages/tokens/src/sanoma-learning/light-new.json
index 00708c28b4..f23ba41b60 100644
--- a/packages/tokens/src/sanoma-learning/light-new.json
+++ b/packages/tokens/src/sanoma-learning/light-new.json
@@ -836,7 +836,7 @@
       },
       "neutral": {
         "subtle": {
-          "value": "{color.background.accent.grey.subtle}",
+          "value": "{color.palette.grey.100}",
           "type": "color",
           "description": "Use for subtle borders on color.background.neutral background colors."
         },
@@ -853,7 +853,7 @@
       },
       "info": {
         "subtle": {
-          "value": "{color.background.accent.blue.subtle}",
+          "value": "{color.palette.blue.100}",
           "type": "color",
           "description": "Use for subtle borders on color.background.info background colors."
         },
@@ -1015,7 +1015,7 @@
     },
     "background": {
       "disabled": {
-        "value": "{color.palette.grey.100}",
+        "value": "{color.background.accent.grey.subtlest}",
         "type": "color",
         "description": "Use for backgrounds of elements in disabled state."
       },
@@ -1120,7 +1120,7 @@
       },
       "neutral": {
         "subtlest": {
-          "value": "{color.background.accent.grey.subtlest}",
+          "value": "{color.palette.grey.050}",
           "type": "color",
           "description": "The subtlest background in the neutral action color."
         },
@@ -1136,7 +1136,7 @@
         },
         "interactive": {
           "bold": {
-            "value": "{color.background.accent.grey.interactive.bold}",
+            "value": "{color.palette.grey.600}",
             "type": "color",
             "description": "Used as transparent layer on top of the bold background to indicate the hover and pressed state."
           },
@@ -1615,7 +1615,7 @@
           "y": "0",
           "blur": "10",
           "spread": "0",
-          "color": "rgba({color.palette.grey.700}, {opacity.subtle})",
+          "color": "rgba({color.palette.grey.900}, {opacity.subtle})",
           "type": "dropShadow"
         },
         "type": "boxShadow",
@@ -1652,6 +1652,20 @@
           "value": "25%",
           "type": "opacity"
         }
+      },
+      "reversed": {
+        "idle": {
+          "value": "80%",
+          "type": "opacity"
+        },
+        "hover": {
+          "value": "90%",
+          "type": "opacity"
+        },
+        "active": {
+          "value": "100%",
+          "type": "opacity"
+        }
       }
     },
     "muted": {
diff --git a/packages/tokens/src/system.json b/packages/tokens/src/system.json
index 596d079d4b..ab2c3b8017 100644
--- a/packages/tokens/src/system.json
+++ b/packages/tokens/src/system.json
@@ -440,6 +440,22 @@
         "type": "opacity"
       }
     },
+    "interactive": {
+      "reversed": {
+        "idle": {
+          "value": "80%",
+          "type": "opacity"
+        },
+        "hover": {
+          "value": "90%",
+          "type": "opacity"
+        },
+        "active": {
+          "value": "100%",
+          "type": "opacity"
+        }
+      }
+    },
     "dark": {
       "interactive": {
         "bold": {