diff --git a/COMPONENT_INDEX.md b/COMPONENT_INDEX.md
index bf80ff3e..48a2f4c7 100644
--- a/COMPONENT_INDEX.md
+++ b/COMPONENT_INDEX.md
@@ -304,9 +304,9 @@ None.
 
 ### Slots
 
-| Slot name | Default | Props                                                                     | Fallback |
-| :-------- | :------ | :------------------------------------------------------------------------ | :------- |
-| --        | Yes     | <code>{props?: { ["aria-current"]?: string; class: "bx--link"; }} </code> | --       |
+| Slot name | Default | Props                                                                      | Fallback |
+| :-------- | :------ | :------------------------------------------------------------------------- | :------- |
+| --        | Yes     | <code>{props?: { ["aria-current"]?: string; class: "cds--link"; }} </code> | --       |
 
 ### Events
 
@@ -2621,10 +2621,10 @@ None.
 
 ### Slots
 
-| Slot name | Default | Props | Fallback                                                                                                                                                                                   |
-| :-------- | :------ | :---- | :----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
-| --        | Yes     | --    | --                                                                                                                                                                                         |
-| menu      | No      | --    | <code>&lt;svelte:component<br /> this="{icon}"<br /> aria-label="{iconDescription}"<br /> title="{iconDescription}"<br /> class="bx--overflow-menu\_\_icon {iconClass}"<br /> /&gt;</code> |
+| Slot name | Default | Props | Fallback                                                                                                                                                                                    |
+| :-------- | :------ | :---- | :------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ |
+| --        | Yes     | --    | --                                                                                                                                                                                          |
+| menu      | No      | --    | <code>&lt;svelte:component<br /> this="{icon}"<br /> aria-label="{iconDescription}"<br /> title="{iconDescription}"<br /> class="cds--overflow-menu\_\_icon {iconClass}"<br /> /&gt;</code> |
 
 ### Events
 
@@ -2655,9 +2655,9 @@ None.
 
 ### Slots
 
-| Slot name | Default | Props | Fallback                                                                                                            |
-| :-------- | :------ | :---- | :------------------------------------------------------------------------------------------------------------------ |
-| --        | Yes     | --    | <code>&lt;div class:bx--overflow-menu-options\_\_option-content="{true}"&gt;<br /> {text}<br /> &lt;/div&gt;</code> |
+| Slot name | Default | Props | Fallback                                                                                                             |
+| :-------- | :------ | :---- | :------------------------------------------------------------------------------------------------------------------- |
+| --        | Yes     | --    | <code>&lt;div class:cds--overflow-menu-options\_\_option-content="{true}"&gt;<br /> {text}<br /> &lt;/div&gt;</code> |
 
 ### Events
 
@@ -2933,9 +2933,9 @@ None.
 
 ### Slots
 
-| Slot name | Default | Props                                                    | Fallback                                                                  |
-| :-------- | :------ | :------------------------------------------------------- | :------------------------------------------------------------------------ |
-| --        | Yes     | <code>{ props: { class: 'bx--progress-label' } } </code> | <code>&lt;p class:bx--progress-label="{true}"&gt;{label}&lt;/p&gt;</code> |
+| Slot name | Default | Props                                                     | Fallback                                                                   |
+| :-------- | :------ | :-------------------------------------------------------- | :------------------------------------------------------------------------- |
+| --        | Yes     | <code>{ props: { class: 'cds--progress-label' } } </code> | <code>&lt;p class:cds--progress-label="{true}"&gt;{label}&lt;/p&gt;</code> |
 
 ### Events
 
@@ -4022,10 +4022,10 @@ None.
 
 ### Slots
 
-| Slot name | Default | Props                                                  | Fallback                                              |
-| :-------- | :------ | :----------------------------------------------------- | :---------------------------------------------------- |
-| --        | Yes     | <code>{ props: { class: 'bx--tag\_\_label' } } </code> | --                                                    |
-| icon      | No      | --                                                     | <code>&lt;svelte:component this="{icon}" /&gt;</code> |
+| Slot name | Default | Props                                                   | Fallback                                              |
+| :-------- | :------ | :------------------------------------------------------ | :---------------------------------------------------- |
+| --        | Yes     | <code>{ props: { class: 'cds--tag\_\_label' } } </code> | --                                                    |
+| icon      | No      | --                                                      | <code>&lt;svelte:component this="{icon}" /&gt;</code> |
 
 ### Events
 
@@ -4197,7 +4197,7 @@ None.
 ### Types
 
 ```ts
-export type CarbonTheme = "white" | "g10" | "g80" | "g90" | "g100";
+export type CarbonTheme = "white" | "g10" | "g90" | "g100";
 ```
 
 ### Props
diff --git a/README.md b/README.md
index 350c0028..224fcb5c 100644
--- a/README.md
+++ b/README.md
@@ -45,11 +45,10 @@ pnpm i -D carbon-components-svelte
 
 ### Styling
 
-Before importing components, you will need to first apply Carbon component styles. The Carbon Design System supports five themes (2 light, 3 dark).
+Before importing components, you will need to first apply Carbon component styles. The Carbon Design System supports four themes (2 light, 2 dark).
 
 - **white.css**: Default Carbon theme (light)
 - **g10.css**: Gray 10 theme (light)
-- **g80.css**: Gray 80 theme (dark)
 - **g90.css**: Gray 90 theme (dark)
 - **g100.css**: Gray 100 theme (dark)
 - **all.css**: All themes (White, Gray 10, Gray 90, Gray 100) using [CSS variables](https://developer.mozilla.org/en-US/docs/Web/CSS/Using_CSS_custom_properties)
@@ -60,7 +59,6 @@ The compiled CSS is generated from the following `.scss` files:
 
 - [css/white.scss](css/white.scss)
 - [css/g10.scss](css/g10.scss)
-- [css/g80.scss](css/g80.scss)
 - [css/g90.scss](css/g90.scss)
 - [css/g100.scss](css/g100.scss)
 - [css/all.scss](css/all.scss)
@@ -74,9 +72,6 @@ import "carbon-components-svelte/css/white.css";
 // Gray 10 theme
 import "carbon-components-svelte/css/g10.css";
 
-// Gray 80 theme
-import "carbon-components-svelte/css/g80.css";
-
 // Gray 90 theme
 import "carbon-components-svelte/css/g90.css";
 
@@ -147,7 +142,7 @@ Programmatically switch between each of the five Carbon themes by setting the "t
 
 ```html
 <script>
-  let theme = "white"; // "white" | "g10" | "g80" | "g90" | "g100"
+  let theme = "white"; // "white" | "g10" | "g90" | "g100"
 
   $: document.documentElement.setAttribute("theme", theme);
 </script>
diff --git a/docs/index.html b/docs/index.html
index 967bda15..e49c0552 100644
--- a/docs/index.html
+++ b/docs/index.html
@@ -9,7 +9,7 @@
       try {
         const theme = localStorage.getItem("theme");
 
-        if (["white", "g10", "g80", "g90", "g100"].includes(theme)) {
+        if (["white", "g10", "g90", "g100"].includes(theme)) {
           document.documentElement.setAttribute("theme", theme);
           document.documentElement.style.setProperty("color-scheme", ["white", "g10"].includes(theme) ? "light" : "dark");
         }
diff --git a/docs/src/COMPONENT_API.json b/docs/src/COMPONENT_API.json
index 7d1360a1..6e25be0c 100644
--- a/docs/src/COMPONENT_API.json
+++ b/docs/src/COMPONENT_API.json
@@ -13074,9 +13074,9 @@
       ],
       "typedefs": [
         {
-          "type": "\"white\" | \"g10\" | \"g80\" | \"g90\" | \"g100\"",
+          "type": "\"white\" | \"g10\" | \"g90\" | \"g100\"",
           "name": "CarbonTheme",
-          "ts": "type CarbonTheme = \"white\" | \"g10\" | \"g80\" | \"g90\" | \"g100\""
+          "ts": "type CarbonTheme = \"white\" | \"g10\" | \"g90\" | \"g100\""
         }
       ]
     },
diff --git a/docs/src/layouts/ComponentLayout.svelte b/docs/src/layouts/ComponentLayout.svelte
index 02801f85..3b59c25b 100644
--- a/docs/src/layouts/ComponentLayout.svelte
+++ b/docs/src/layouts/ComponentLayout.svelte
@@ -37,7 +37,7 @@
     const searchParams = new URLSearchParams(window.location.search);
     const current_theme = searchParams.get("theme");
 
-    if (["white", "g10", "g80", "g90", "g100"].includes(current_theme)) {
+    if (["white", "g10", "g90", "g100"].includes(current_theme)) {
       theme.set(current_theme);
     }
   });
@@ -87,7 +87,6 @@
           >
             <SelectItem value="white" text="White" />
             <SelectItem value="g10" text="Gray 10" />
-            <SelectItem value="g80" text="Gray 80" />
             <SelectItem value="g90" text="Gray 90" />
             <SelectItem value="g100" text="Gray 100" />
           </Select>
diff --git a/docs/src/pages/components/Select.svx b/docs/src/pages/components/Select.svx
index bb6ad473..3ddaf656 100644
--- a/docs/src/pages/components/Select.svx
+++ b/docs/src/pages/components/Select.svx
@@ -14,7 +14,6 @@ If the `selected` prop is not set, the value of the first `SelectItem` will be u
 <Select labelText="Carbon theme" on:change={e => console.log("value", e.target.value)}>
   <SelectItem value="white" />
   <SelectItem value="g10" />
-  <SelectItem value="g80" />
   <SelectItem value="g90" />
   <SelectItem value="g100" />
 </Select>
@@ -26,7 +25,6 @@ Use the `text` prop on `SelectItem` to customize the display value.
 <Select labelText="Carbon theme" on:change={e => console.log("value", e.target.value)}>
   <SelectItem value="white" text="White" />
   <SelectItem value="g10" text="Gray 10" />
-  <SelectItem value="g80" text="Gray 80" />
   <SelectItem value="g90" text="Gray 90" />
   <SelectItem value="g100" text="Gray 100" />
 </Select>
@@ -38,7 +36,6 @@ Use the `selected` prop to specify an initial value.
 <Select labelText="Carbon theme" selected="g10" on:change={e => console.log("value", e.target.value)}>
   <SelectItem value="white" text="White" />
   <SelectItem value="g10" text="Gray 10" />
-  <SelectItem value="g80" text="Gray 80" />
   <SelectItem value="g90" text="Gray 90" />
   <SelectItem value="g100" text="Gray 100" />
 </Select>
@@ -51,10 +48,9 @@ The `selected` prop is reactive and supports two-way binding.
 
 ## Helper text
 
-<Select helperText="Carbon offers 4 themes (2 light, 3 dark)" labelText="Carbon theme" selected="g10" >
+<Select helperText="Carbon offers 4 themes (2 light, 2 dark)" labelText="Carbon theme" selected="g10" >
   <SelectItem value="white" text="White" />
   <SelectItem value="g10" text="Gray 10" />
-  <SelectItem value="g80" text="Gray 80" />
   <SelectItem value="g90" text="Gray 90" />
   <SelectItem value="g100" text="Gray 100" />
 </Select>
@@ -64,7 +60,6 @@ The `selected` prop is reactive and supports two-way binding.
 <Select hideLabel labelText="Carbon theme" selected="g10" >
   <SelectItem value="white" text="White" />
   <SelectItem value="g10" text="Gray 10" />
-  <SelectItem value="g80" text="Gray 80" />
   <SelectItem value="g90" text="Gray 90" />
   <SelectItem value="g100" text="Gray 100" />
 </Select>
@@ -78,7 +73,6 @@ The `selected` prop is reactive and supports two-way binding.
     <SelectItem value="g10" text="Gray 10" />
   </SelectItemGroup>
   <SelectItemGroup label="Dark theme">
-    <SelectItem value="g80" text="Gray 80" />
     <SelectItem value="g90" text="Gray 90" />
     <SelectItem value="g100" text="Gray 100" />
   </SelectItemGroup>
@@ -89,7 +83,6 @@ The `selected` prop is reactive and supports two-way binding.
 <Select light labelText="Carbon theme" selected="g10" >
   <SelectItem value="white" text="White" />
   <SelectItem value="g10" text="Gray 10" />
-  <SelectItem value="g80" text="Gray 80" />
   <SelectItem value="g90" text="Gray 90" />
   <SelectItem value="g100" text="Gray 100" />
 </Select>
@@ -99,7 +92,6 @@ The `selected` prop is reactive and supports two-way binding.
 <Select inline labelText="Carbon theme" selected="g10" >
   <SelectItem value="white" text="White" />
   <SelectItem value="g10" text="Gray 10" />
-  <SelectItem value="g80" text="Gray 80" />
   <SelectItem value="g90" text="Gray 90" />
   <SelectItem value="g100" text="Gray 100" />
 </Select>
@@ -109,7 +101,6 @@ The `selected` prop is reactive and supports two-way binding.
 <Select size="lg" labelText="Carbon theme" selected="g10" >
   <SelectItem value="white" text="White" />
   <SelectItem value="g10" text="Gray 10" />
-  <SelectItem value="g80" text="Gray 80" />
   <SelectItem value="g90" text="Gray 90" />
   <SelectItem value="g100" text="Gray 100" />
 </Select>
@@ -119,7 +110,6 @@ The `selected` prop is reactive and supports two-way binding.
 <Select size="sm" labelText="Carbon theme" selected="g10" >
   <SelectItem value="white" text="White" />
   <SelectItem value="g10" text="Gray 10" />
-  <SelectItem value="g80" text="Gray 80" />
   <SelectItem value="g90" text="Gray 90" />
   <SelectItem value="g100" text="Gray 100" />
 </Select>
@@ -129,7 +119,6 @@ The `selected` prop is reactive and supports two-way binding.
 <Select invalid invalidText="Theme must be a dark variant" labelText="Carbon theme" selected="g10" >
   <SelectItem value="white" text="White" />
   <SelectItem value="g10" text="Gray 10" />
-  <SelectItem value="g80" text="Gray 80" />
   <SelectItem value="g90" text="Gray 90" />
   <SelectItem value="g100" text="Gray 100" />
 </Select>
@@ -139,7 +128,6 @@ The `selected` prop is reactive and supports two-way binding.
 <Select warn warnText="The selected theme will not be persisted" labelText="Carbon theme" selected="g10" >
   <SelectItem value="white" text="White" />
   <SelectItem value="g10" text="Gray 10" />
-  <SelectItem value="g80" text="Gray 80" />
   <SelectItem value="g90" text="Gray 90" />
   <SelectItem value="g100" text="Gray 100" />
 </Select>
@@ -149,7 +137,6 @@ The `selected` prop is reactive and supports two-way binding.
 <Select disabled labelText="Carbon theme" selected="g10" >
   <SelectItem value="white" text="White" />
   <SelectItem value="g10" text="Gray 10" />
-  <SelectItem value="g80" text="Gray 80" />
   <SelectItem value="g90" text="Gray 90" />
   <SelectItem value="g100" text="Gray 100" />
 </Select>
diff --git a/docs/src/pages/framed/Select/SelectReactive.svelte b/docs/src/pages/framed/Select/SelectReactive.svelte
index 43f4b729..df111242 100644
--- a/docs/src/pages/framed/Select/SelectReactive.svelte
+++ b/docs/src/pages/framed/Select/SelectReactive.svelte
@@ -7,7 +7,6 @@
 <Select labelText="Carbon theme" bind:selected="{selected}">
   <SelectItem value="white" text="White" />
   <SelectItem value="g10" text="Gray 10" />
-  <SelectItem value="g80" text="Gray 80" />
   <SelectItem value="g90" text="Gray 90" />
   <SelectItem value="g100" text="Gray 100" />
 </Select>
diff --git a/docs/src/pages/framed/Theme/Theme.svelte b/docs/src/pages/framed/Theme/Theme.svelte
index b99cb540..a35cf212 100644
--- a/docs/src/pages/framed/Theme/Theme.svelte
+++ b/docs/src/pages/framed/Theme/Theme.svelte
@@ -11,7 +11,7 @@
 <Theme bind:theme />
 
 <RadioButtonGroup legendText="Carbon theme" bind:selected="{theme}">
-  {#each ["white", "g10", "g80", "g90", "g100"] as value}
+  {#each ["white", "g10", "g90", "g100"] as value}
     <RadioButton labelText="{value}" value="{value}" />
   {/each}
 </RadioButtonGroup>
diff --git a/docs/src/pages/framed/Theme/ThemePersist.svelte b/docs/src/pages/framed/Theme/ThemePersist.svelte
index bd43a91a..b1e49458 100644
--- a/docs/src/pages/framed/Theme/ThemePersist.svelte
+++ b/docs/src/pages/framed/Theme/ThemePersist.svelte
@@ -8,10 +8,10 @@
   let theme = "g90";
 </script>
 
-<Theme bind:theme persist persistKey="__carbon-theme" />
+<Theme bind:theme="{theme}" persist persistKey="__carbon-theme" />
 
 <RadioButtonGroup legendText="Carbon theme" bind:selected="{theme}">
-  {#each ["white", "g10", "g80", "g90", "g100"] as value}
+  {#each ["white", "g10", "g90", "g100"] as value}
     <RadioButton labelText="{value}" value="{value}" />
   {/each}
 </RadioButtonGroup>
diff --git a/docs/src/pages/framed/Theme/ThemeToggleCustom.svelte b/docs/src/pages/framed/Theme/ThemeToggleCustom.svelte
index 635bd7b3..51ad81ba 100644
--- a/docs/src/pages/framed/Theme/ThemeToggleCustom.svelte
+++ b/docs/src/pages/framed/Theme/ThemeToggleCustom.svelte
@@ -5,7 +5,7 @@
 <Theme
   render="toggle"
   toggle="{{
-    themes: ['g10', 'g80'],
+    themes: ['g10', 'g90'],
     labelA: 'Enable dark mode',
     labelB: 'Enable dark mode',
     hideLabel: true,
diff --git a/docs/src/pages/framed/_reset.svelte b/docs/src/pages/framed/_reset.svelte
index c29d9869..dc2b42da 100644
--- a/docs/src/pages/framed/_reset.svelte
+++ b/docs/src/pages/framed/_reset.svelte
@@ -15,7 +15,7 @@
     // NOTE: we *do not* want to persist the theme as this can
     // conflict with how the iframe is displayed in the docs.
     // Instead, we want the theme to be overridden in the standalone page.
-    if (["white", "g10", "g80", "g90", "g100"].includes(current_theme)) {
+    if (["white", "g10", "g90", "g100"].includes(current_theme)) {
       document.documentElement.setAttribute("theme", current_theme);
       document.documentElement.style.setProperty(
         "color-scheme",
diff --git a/docs/src/pages/index.svelte b/docs/src/pages/index.svelte
index 47de1dde..552145cd 100644
--- a/docs/src/pages/index.svelte
+++ b/docs/src/pages/index.svelte
@@ -27,7 +27,6 @@
   const themes = {
     white: "White",
     g10: "Gray 10",
-    g80: "Gray 80",
     g90: "Gray 90",
     g100: "Gray 100",
     all: "All",
@@ -35,7 +34,7 @@
 
   const cssImportAll = `import "carbon-components-svelte/css/all.css";`;
   const cssThemeToggle = `<script>
-  let theme = "${$theme}"; // "white" | "g10" | "g80" | "g90" | "g100"
+  let theme = "${$theme}"; // "white" | "g10" | "g90" | "g100"
 
   $: document.documentElement.setAttribute("theme", theme);
 <\/script>
diff --git a/src/Theme/Theme.svelte b/src/Theme/Theme.svelte
index 38a3c969..3149afd2 100644
--- a/src/Theme/Theme.svelte
+++ b/src/Theme/Theme.svelte
@@ -5,7 +5,7 @@
    */
 
   /**
-   * @typedef {"white" | "g10" | "g80" | "g90" | "g100"} CarbonTheme
+   * @typedef {"white" | "g10" | "g90" | "g100"} CarbonTheme
    * @event {{ theme: CarbonTheme; }} update
    * @slot {{ theme: CarbonTheme; }}
    */
@@ -51,7 +51,6 @@
   const themes = {
     white: "White",
     g10: "Gray 10",
-    g80: "Gray 80",
     g90: "Gray 90",
     g100: "Gray 100",
   };
@@ -79,11 +78,11 @@
 
   $: if (typeof window !== "undefined") {
     Object.entries(tokens).forEach(([token, value]) => {
-      document.documentElement.style.setProperty(`--bx-${token}`, value);
+      document.documentElement.style.setProperty(`--cds-${token}`, value);
     });
 
     if (theme in themes) {
-      document.documentElement.setAttribute("theme", theme);
+      document.documentElement.setAttribute("data-carbon-theme", theme);
       dispatch("update", { theme });
     } else {
       console.warn(
diff --git a/types/Breadcrumb/BreadcrumbItem.svelte.d.ts b/types/Breadcrumb/BreadcrumbItem.svelte.d.ts
index bdf2aee8..bfdc1082 100644
--- a/types/Breadcrumb/BreadcrumbItem.svelte.d.ts
+++ b/types/Breadcrumb/BreadcrumbItem.svelte.d.ts
@@ -27,5 +27,5 @@ export default class BreadcrumbItem extends SvelteComponentTyped<
     mouseenter: WindowEventMap["mouseenter"];
     mouseleave: WindowEventMap["mouseleave"];
   },
-  { default: { props?: { ["aria-current"]?: string; class: "bx--link" } } }
+  { default: { props?: { ["aria-current"]?: string; class: "cds--link" } } }
 > {}
diff --git a/types/ProgressIndicator/ProgressStep.svelte.d.ts b/types/ProgressIndicator/ProgressStep.svelte.d.ts
index 059d99eb..0380ff24 100644
--- a/types/ProgressIndicator/ProgressStep.svelte.d.ts
+++ b/types/ProgressIndicator/ProgressStep.svelte.d.ts
@@ -64,5 +64,5 @@ export default class ProgressStep extends SvelteComponentTyped<
     mouseleave: WindowEventMap["mouseleave"];
     keydown: WindowEventMap["keydown"];
   },
-  { default: { props: { class: "bx--progress-label" } } }
+  { default: { props: { class: "cds--progress-label" } } }
 > {}
diff --git a/types/Tag/Tag.svelte.d.ts b/types/Tag/Tag.svelte.d.ts
index f51dcd77..8f68208d 100644
--- a/types/Tag/Tag.svelte.d.ts
+++ b/types/Tag/Tag.svelte.d.ts
@@ -81,5 +81,5 @@ export default class Tag extends SvelteComponentTyped<
     mouseleave: WindowEventMap["mouseleave"];
     close: CustomEvent<null>;
   },
-  { default: { props: { class: "bx--tag__label" } }; icon: {} }
+  { default: { props: { class: "cds--tag__label" } }; icon: {} }
 > {}
diff --git a/types/Theme/Theme.svelte.d.ts b/types/Theme/Theme.svelte.d.ts
index 3508711d..770bf812 100644
--- a/types/Theme/Theme.svelte.d.ts
+++ b/types/Theme/Theme.svelte.d.ts
@@ -1,6 +1,6 @@
 import type { SvelteComponentTyped } from "svelte";
 
-export type CarbonTheme = "white" | "g10" | "g80" | "g90" | "g100";
+export type CarbonTheme = "white" | "g10" | "g90" | "g100";
 
 export interface ThemeProps {
   /**