diff --git a/package.json b/package.json
index 1ab9d9d8b..b02faf020 100644
--- a/package.json
+++ b/package.json
@@ -72,7 +72,6 @@
     "@types/jest-specific-snapshot": "^0.5.9",
     "@types/node": "^18.19.59",
     "@types/prettier": "^2.4.3",
-    "@types/styled-components": "^5.1.21",
     "@types/webpack": "^5.28.0",
     "@typescript-eslint/eslint-plugin": "^5.55.0",
     "@typescript-eslint/parser": "^5.55.0",
@@ -110,7 +109,7 @@
     "storybook": "^8.0.5",
     "storybook-dark-mode": "^4.0.1",
     "style-loader": "^3.3.4",
-    "styled-components": "^5.3.3",
+    "styled-components": "^6.1.12",
     "stylelint": "^14.3.0",
     "stylelint-config-prettier": "^9.0.3",
     "stylelint-config-recommended": "^6.0.0",
@@ -126,8 +125,7 @@
   "packageManager": "yarn@3.1.0",
   "resolutions": {
     "node-gyp": "^9.0.0",
-    "postcss": "^8.4.16",
-    "@types/react": "^18.3.3"
+    "postcss": "^8.4.16"
   },
   "lint-staged": {
     "*": [
diff --git a/packages/icons/package.json b/packages/icons/package.json
index 66c349eaf..a6fc02f1b 100644
--- a/packages/icons/package.json
+++ b/packages/icons/package.json
@@ -23,14 +23,13 @@
   "devDependencies": {
     "@storybook/react": "^8.0.5",
     "@types/react": "^18.3.3",
-    "@types/styled-components": "^5.1.21",
     "@types/warning": "^3.0.0",
     "@types/webpack-env": "^1.18.1",
     "@vitejs/plugin-react": "^4.3.1",
     "jsdom": "^24.1.0",
     "react": "^18.3.1",
     "rimraf": "^3.0.2",
-    "styled-components": "^5.3.3",
+    "styled-components": "^6.1.12",
     "tsup": "^6.5.0",
     "typescript": "^4.9.5",
     "vitest": "^2.0.1"
diff --git a/packages/react-sandbox/package.json b/packages/react-sandbox/package.json
index 468e3e5e9..5526f1c38 100644
--- a/packages/react-sandbox/package.json
+++ b/packages/react-sandbox/package.json
@@ -34,7 +34,6 @@
     "@types/react": "^18.3.3",
     "@types/react-dom": "^18.3.0",
     "@types/react-router-dom": "^5.3.3",
-    "@types/styled-components": "^5.1.21",
     "@types/warning": "^3.0.0",
     "@vitejs/plugin-react": "^4.3.1",
     "jsdom": "^24.1.0",
@@ -43,7 +42,7 @@
     "react-dom": "^18.3.1",
     "react-router-dom": "^6.2.1",
     "rimraf": "^3.0.2",
-    "styled-components": "^5.3.3",
+    "styled-components": "^6.1.12",
     "tsup": "^6.5.0",
     "typescript": "^4.9.5",
     "use-resize-observer": "^9.1.0",
@@ -60,9 +59,9 @@
     "warning": "^4.0.3"
   },
   "peerDependencies": {
-    "react": ">=17.0.0",
-    "react-dom": ">=17.0.0",
-    "styled-components": ">=5.1.1"
+    "react": ">=18.0.0",
+    "react-dom": ">=18.0.0",
+    "styled-components": ">=6.0.0"
   },
   "files": [
     "src",
diff --git a/packages/styled/package.json b/packages/styled/package.json
index e799b3f7f..e872ce4e3 100644
--- a/packages/styled/package.json
+++ b/packages/styled/package.json
@@ -23,7 +23,6 @@
   "devDependencies": {
     "@types/react": "^18.3.3",
     "@types/react-test-renderer": "^18.3.0",
-    "@types/styled-components": "^5.1.21",
     "@types/warning": "^3.0.0",
     "@vitejs/plugin-react": "^4.3.1",
     "jest-styled-components": "^7.1.1",
@@ -32,7 +31,7 @@
     "react": "^18.3.1",
     "react-test-renderer": "^18.3.1",
     "rimraf": "^3.0.2",
-    "styled-components": "^5.3.3",
+    "styled-components": "^6.1.12",
     "tsup": "^6.5.0",
     "typescript": "^4.9.5",
     "vitest": "^2.0.2"
@@ -44,8 +43,8 @@
     "warning": "^4.0.3"
   },
   "peerDependencies": {
-    "react": ">=17.0.0",
-    "styled-components": ">=5.1.1"
+    "react": ">=18.0.0",
+    "styled-components": ">=6.0.0"
   },
   "files": [
     "src",
diff --git a/packages/styled/src/addThemeUtils.story.tsx b/packages/styled/src/addThemeUtils.story.tsx
index 90b2d406d..fd715f171 100644
--- a/packages/styled/src/addThemeUtils.story.tsx
+++ b/packages/styled/src/addThemeUtils.story.tsx
@@ -1,3 +1,4 @@
+import { light } from '@charcoal-ui/theme'
 import styled, { ThemeProvider } from 'styled-components'
 import { MyTheme, myTheme } from './storyHelper'
 
@@ -10,7 +11,7 @@ declare module 'styled-components' {
 }
 
 export const Example = () => (
-  <ThemeProvider theme={myTheme}>
+  <ThemeProvider theme={(theme) => myTheme(theme ?? light)}>
     <RootDiv>
       <Bg1Div>
         <TypographyDiv>
diff --git a/packages/styled/src/utils/gap.ts b/packages/styled/src/utils/gap.ts
index c8a643500..ad780d2b0 100644
--- a/packages/styled/src/utils/gap.ts
+++ b/packages/styled/src/utils/gap.ts
@@ -1,13 +1,10 @@
 import { Spacing } from '@charcoal-ui/theme'
-import { css, FlattenSimpleInterpolation } from 'styled-components'
+import { css, RuleSet } from 'styled-components'
 import { pxIfNum } from './helpers/pxIfNum'
 
-export function gap(v1: keyof Spacing): FlattenSimpleInterpolation
+export function gap(v1: keyof Spacing): RuleSet
 
-export function gap(
-  v1: keyof Spacing,
-  v2: keyof Spacing
-): FlattenSimpleInterpolation
+export function gap(v1: keyof Spacing, v2: keyof Spacing): RuleSet
 
 export function gap(v1: keyof Spacing, v2?: keyof Spacing) {
   return css`
diff --git a/packages/styled/src/utils/margin.ts b/packages/styled/src/utils/margin.ts
index 07fbf7504..ad59dbe60 100644
--- a/packages/styled/src/utils/margin.ts
+++ b/packages/styled/src/utils/margin.ts
@@ -1,26 +1,23 @@
-import { css, FlattenSimpleInterpolation } from 'styled-components'
+import { css, RuleSet } from 'styled-components'
 import { SpacingType } from './helpers/SpacingType'
 import { pxIfNum } from './helpers/pxIfNum'
 
-export function margin(arg1: SpacingType): FlattenSimpleInterpolation
+export function margin(arg1: SpacingType): RuleSet
 
-export function margin(
-  arg1: SpacingType,
-  arg2: SpacingType
-): FlattenSimpleInterpolation
+export function margin(arg1: SpacingType, arg2: SpacingType): RuleSet
 
 export function margin(
   arg1: SpacingType,
   arg2: SpacingType,
   arg3: SpacingType
-): FlattenSimpleInterpolation
+): RuleSet
 
 export function margin(
   arg1: SpacingType,
   arg2: SpacingType,
   arg3: SpacingType,
   arg4: SpacingType
-): FlattenSimpleInterpolation
+): RuleSet
 
 export function margin(
   arg1: SpacingType,
diff --git a/packages/styled/src/utils/padding.ts b/packages/styled/src/utils/padding.ts
index 85c5b66d5..9de9e8184 100644
--- a/packages/styled/src/utils/padding.ts
+++ b/packages/styled/src/utils/padding.ts
@@ -1,26 +1,23 @@
 import { Spacing } from '@charcoal-ui/theme'
-import { css, FlattenSimpleInterpolation } from 'styled-components'
+import { css, RuleSet } from 'styled-components'
 import { pxIfNum } from './helpers/pxIfNum'
 
-export function padding(arg1: keyof Spacing): FlattenSimpleInterpolation
+export function padding(arg1: keyof Spacing): RuleSet
 
-export function padding(
-  arg1: keyof Spacing,
-  arg2: keyof Spacing
-): FlattenSimpleInterpolation
+export function padding(arg1: keyof Spacing, arg2: keyof Spacing): RuleSet
 
 export function padding(
   arg1: keyof Spacing,
   arg2: keyof Spacing,
   arg3: keyof Spacing
-): FlattenSimpleInterpolation
+): RuleSet
 
 export function padding(
   arg1: keyof Spacing,
   arg2: keyof Spacing,
   arg3: keyof Spacing,
   arg4: keyof Spacing
-): FlattenSimpleInterpolation
+): RuleSet
 
 export function padding(
   arg1: keyof Spacing,
diff --git a/yarn.lock b/yarn.lock
index fde5483e1..56ad9a97d 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -80,17 +80,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@babel/code-frame@npm:^7.25.9, @babel/code-frame@npm:^7.26.2":
-  version: 7.26.2
-  resolution: "@babel/code-frame@npm:7.26.2"
-  dependencies:
-    "@babel/helper-validator-identifier": ^7.25.9
-    js-tokens: ^4.0.0
-    picocolors: ^1.0.0
-  checksum: db13f5c42d54b76c1480916485e6900748bbcb0014a8aca87f50a091f70ff4e0d0a6db63cade75eb41fcc3d2b6ba0a7f89e343def4f96f00269b41b8ab8dd7b8
-  languageName: node
-  linkType: hard
-
 "@babel/compat-data@npm:^7.22.6, @babel/compat-data@npm:^7.23.5":
   version: 7.23.5
   resolution: "@babel/compat-data@npm:7.23.5"
@@ -217,19 +206,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@babel/generator@npm:^7.26.5":
-  version: 7.26.5
-  resolution: "@babel/generator@npm:7.26.5"
-  dependencies:
-    "@babel/parser": ^7.26.5
-    "@babel/types": ^7.26.5
-    "@jridgewell/gen-mapping": ^0.3.5
-    "@jridgewell/trace-mapping": ^0.3.25
-    jsesc: ^3.0.2
-  checksum: baa42a98cd01efa3ae3634a6caa81d0738e5e0bdba4efbf1ac735216c8d7cf6bdffeab69c468e6ab2063b07db402346113def4962719746756518432f83c53ba
-  languageName: node
-  linkType: hard
-
 "@babel/helper-annotate-as-pure@npm:^7.22.5":
   version: 7.22.5
   resolution: "@babel/helper-annotate-as-pure@npm:7.22.5"
@@ -384,16 +360,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@babel/helper-module-imports@npm:^7.0.0":
-  version: 7.25.9
-  resolution: "@babel/helper-module-imports@npm:7.25.9"
-  dependencies:
-    "@babel/traverse": ^7.25.9
-    "@babel/types": ^7.25.9
-  checksum: 1b411ce4ca825422ef7065dffae7d8acef52023e51ad096351e3e2c05837e9bf9fca2af9ca7f28dc26d596a588863d0fedd40711a88e350b736c619a80e704e6
-  languageName: node
-  linkType: hard
-
 "@babel/helper-module-imports@npm:^7.16.7, @babel/helper-module-imports@npm:^7.24.7":
   version: 7.24.7
   resolution: "@babel/helper-module-imports@npm:7.24.7"
@@ -568,13 +534,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@babel/helper-string-parser@npm:^7.25.9":
-  version: 7.25.9
-  resolution: "@babel/helper-string-parser@npm:7.25.9"
-  checksum: 6435ee0849e101681c1849868278b5aee82686ba2c1e27280e5e8aca6233af6810d39f8e4e693d2f2a44a3728a6ccfd66f72d71826a94105b86b731697cdfa99
-  languageName: node
-  linkType: hard
-
 "@babel/helper-validator-identifier@npm:^7.22.20":
   version: 7.22.20
   resolution: "@babel/helper-validator-identifier@npm:7.22.20"
@@ -589,13 +548,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@babel/helper-validator-identifier@npm:^7.25.9":
-  version: 7.25.9
-  resolution: "@babel/helper-validator-identifier@npm:7.25.9"
-  checksum: 5b85918cb1a92a7f3f508ea02699e8d2422fe17ea8e82acd445006c0ef7520fbf48e3dbcdaf7b0a1d571fc3a2715a29719e5226636cb6042e15fe6ed2a590944
-  languageName: node
-  linkType: hard
-
 "@babel/helper-validator-option@npm:^7.23.5":
   version: 7.23.5
   resolution: "@babel/helper-validator-option@npm:7.23.5"
@@ -715,17 +667,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@babel/parser@npm:^7.25.9, @babel/parser@npm:^7.26.5":
-  version: 7.26.5
-  resolution: "@babel/parser@npm:7.26.5"
-  dependencies:
-    "@babel/types": ^7.26.5
-  bin:
-    parser: ./bin/babel-parser.js
-  checksum: 663aebf27c1dc04813e6c1d6e8e8fcb2954163ec297a95bdb3f1d0c2a0f04b504bddc09588fe4b176b43fad28c8a4b2914838a1edffdd426537a42f3ac644f1e
-  languageName: node
-  linkType: hard
-
 "@babel/plugin-bugfix-safari-id-destructuring-collision-in-function-expression@npm:^7.24.1":
   version: 7.24.1
   resolution: "@babel/plugin-bugfix-safari-id-destructuring-collision-in-function-expression@npm:7.24.1"
@@ -1898,17 +1839,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@babel/template@npm:^7.25.9":
-  version: 7.25.9
-  resolution: "@babel/template@npm:7.25.9"
-  dependencies:
-    "@babel/code-frame": ^7.25.9
-    "@babel/parser": ^7.25.9
-    "@babel/types": ^7.25.9
-  checksum: 103641fea19c7f4e82dc913aa6b6ac157112a96d7c724d513288f538b84bae04fb87b1f1e495ac1736367b1bc30e10f058b30208fb25f66038e1f1eb4e426472
-  languageName: node
-  linkType: hard
-
 "@babel/traverse@npm:^7.18.9, @babel/traverse@npm:^7.24.1":
   version: 7.24.1
   resolution: "@babel/traverse@npm:7.24.1"
@@ -1963,21 +1893,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@babel/traverse@npm:^7.25.9, @babel/traverse@npm:^7.4.5":
-  version: 7.26.5
-  resolution: "@babel/traverse@npm:7.26.5"
-  dependencies:
-    "@babel/code-frame": ^7.26.2
-    "@babel/generator": ^7.26.5
-    "@babel/parser": ^7.26.5
-    "@babel/template": ^7.25.9
-    "@babel/types": ^7.26.5
-    debug: ^4.3.1
-    globals: ^11.1.0
-  checksum: 28f28037ec6bb72ded695b2bd79c373f13dc993a408c6037c3d46a1234360342a688c031f9ed4fc8528183892a63b54edce0b516e723fb3dffd606da75496cdc
-  languageName: node
-  linkType: hard
-
 "@babel/types@npm:^7.0.0, @babel/types@npm:^7.22.15, @babel/types@npm:^7.22.19, @babel/types@npm:^7.22.5, @babel/types@npm:^7.23.0, @babel/types@npm:^7.23.6, @babel/types@npm:^7.23.9, @babel/types@npm:^7.3.0, @babel/types@npm:^7.3.3, @babel/types@npm:^7.4.4, @babel/types@npm:^7.8.3":
   version: 7.23.9
   resolution: "@babel/types@npm:7.23.9"
@@ -2011,16 +1926,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@babel/types@npm:^7.25.9, @babel/types@npm:^7.26.5":
-  version: 7.26.5
-  resolution: "@babel/types@npm:7.26.5"
-  dependencies:
-    "@babel/helper-string-parser": ^7.25.9
-    "@babel/helper-validator-identifier": ^7.25.9
-  checksum: 65dc14aa32ace22655c5edadeb99df80776c09cd93c105feaf49cc0583f3116aff0581b7eab630888c39ba61151f251c1399ec982b93585b0d1d1bf4a45b54f9
-  languageName: node
-  linkType: hard
-
 "@base2/pretty-print-object@npm:1.0.1":
   version: 1.0.1
   resolution: "@base2/pretty-print-object@npm:1.0.1"
@@ -2103,14 +2008,13 @@ __metadata:
     "@charcoal-ui/icon-files": ^4.1.0
     "@storybook/react": ^8.0.5
     "@types/react": ^18.3.3
-    "@types/styled-components": ^5.1.21
     "@types/warning": ^3.0.0
     "@types/webpack-env": ^1.18.1
     "@vitejs/plugin-react": ^4.3.1
     jsdom: ^24.1.0
     react: ^18.3.1
     rimraf: ^3.0.2
-    styled-components: ^5.3.3
+    styled-components: ^6.1.12
     tsup: ^6.5.0
     typescript: ^4.9.5
     vitest: ^2.0.1
@@ -2159,7 +2063,6 @@ __metadata:
     "@types/react": ^18.3.3
     "@types/react-dom": ^18.3.0
     "@types/react-router-dom": ^5.3.3
-    "@types/styled-components": ^5.1.21
     "@types/warning": ^3.0.0
     "@vitejs/plugin-react": ^4.3.1
     jsdom: ^24.1.0
@@ -2170,16 +2073,16 @@ __metadata:
     react-router-dom: ^6.2.1
     react-spring: ^9.0.0
     rimraf: ^3.0.2
-    styled-components: ^5.3.3
+    styled-components: ^6.1.12
     tsup: ^6.5.0
     typescript: ^4.9.5
     use-resize-observer: ^9.1.0
     vitest: ^2.0.2
     warning: ^4.0.3
   peerDependencies:
-    react: ">=17.0.0"
-    react-dom: ">=17.0.0"
-    styled-components: ">=5.1.1"
+    react: ">=18.0.0"
+    react-dom: ">=18.0.0"
+    styled-components: ">=6.0.0"
   languageName: unknown
   linkType: soft
 
@@ -2244,7 +2147,6 @@ __metadata:
     "@charcoal-ui/utils": ^4.1.0
     "@types/react": ^18.3.3
     "@types/react-test-renderer": ^18.3.0
-    "@types/styled-components": ^5.1.21
     "@types/warning": ^3.0.0
     "@vitejs/plugin-react": ^4.3.1
     jest-styled-components: ^7.1.1
@@ -2253,14 +2155,14 @@ __metadata:
     react: ^18.3.1
     react-test-renderer: ^18.3.1
     rimraf: ^3.0.2
-    styled-components: ^5.3.3
+    styled-components: ^6.1.12
     tsup: ^6.5.0
     typescript: ^4.9.5
     vitest: ^2.0.2
     warning: ^4.0.3
   peerDependencies:
-    react: ">=17.0.0"
-    styled-components: ">=5.1.1"
+    react: ">=18.0.0"
+    styled-components: ">=6.0.0"
   languageName: unknown
   linkType: soft
 
@@ -2623,12 +2525,19 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@emotion/is-prop-valid@npm:^1.1.0":
-  version: 1.3.1
-  resolution: "@emotion/is-prop-valid@npm:1.3.1"
+"@emotion/is-prop-valid@npm:1.2.2":
+  version: 1.2.2
+  resolution: "@emotion/is-prop-valid@npm:1.2.2"
   dependencies:
-    "@emotion/memoize": ^0.9.0
-  checksum: fe6549d54f389e1a17cb02d832af7ee85fb6ea126fc18d02ca47216e8ff19332c1983f4a0ba68602cfcd3b325ffd4ebf0b2d0c6270f1e7e6fe3fca4ba7741e1a
+    "@emotion/memoize": ^0.8.1
+  checksum: 61f6b128ea62b9f76b47955057d5d86fcbe2a6989d2cd1e583daac592901a950475a37d049b9f7a7c6aa8758a33b408735db759fdedfd1f629df0f85ab60ea25
+  languageName: node
+  linkType: hard
+
+"@emotion/memoize@npm:^0.8.1":
+  version: 0.8.1
+  resolution: "@emotion/memoize@npm:0.8.1"
+  checksum: a19cc01a29fcc97514948eaab4dc34d8272e934466ed87c07f157887406bc318000c69ae6f813a9001c6a225364df04249842a50e692ef7a9873335fbcc141b0
   languageName: node
   linkType: hard
 
@@ -2680,10 +2589,10 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@emotion/stylis@npm:^0.8.4":
-  version: 0.8.5
-  resolution: "@emotion/stylis@npm:0.8.5"
-  checksum: 67ff5958449b2374b329fb96e83cb9025775ffe1e79153b499537c6c8b2eb64b77f32d7b5d004d646973662356ceb646afd9269001b97c54439fceea3203ce65
+"@emotion/unitless@npm:0.8.1":
+  version: 0.8.1
+  resolution: "@emotion/unitless@npm:0.8.1"
+  checksum: 385e21d184d27853bb350999471f00e1429fa4e83182f46cd2c164985999d9b46d558dc8b9cc89975cb337831ce50c31ac2f33b15502e85c299892e67e7b4a88
   languageName: node
   linkType: hard
 
@@ -2694,13 +2603,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@emotion/unitless@npm:^0.7.4":
-  version: 0.7.5
-  resolution: "@emotion/unitless@npm:0.7.5"
-  checksum: f976e5345b53fae9414a7b2e7a949aa6b52f8bdbcc84458b1ddc0729e77ba1d1dfdff9960e0da60183877873d3a631fa24d9695dd714ed94bcd3ba5196586a6b
-  languageName: node
-  linkType: hard
-
 "@emotion/use-insertion-effect-with-fallbacks@npm:^1.0.0, @emotion/use-insertion-effect-with-fallbacks@npm:^1.1.0":
   version: 1.1.0
   resolution: "@emotion/use-insertion-effect-with-fallbacks@npm:1.1.0"
@@ -9133,16 +9035,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@types/hoist-non-react-statics@npm:*":
-  version: 3.3.6
-  resolution: "@types/hoist-non-react-statics@npm:3.3.6"
-  dependencies:
-    "@types/react": "*"
-    hoist-non-react-statics: ^3.3.0
-  checksum: f03e43bd081876c49584ffa0eb690d69991f258203efca44dcc30efdda49a50653ff06402917d1edc9cb7e2adebbe9e2d1d0e739bc99c1b5372103b1cc534e47
-  languageName: node
-  linkType: hard
-
 "@types/html-minifier-terser@npm:^6.0.0":
   version: 6.1.0
   resolution: "@types/html-minifier-terser@npm:6.1.0"
@@ -9493,6 +9385,27 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@types/react@npm:*":
+  version: 17.0.53
+  resolution: "@types/react@npm:17.0.53"
+  dependencies:
+    "@types/prop-types": "*"
+    "@types/scheduler": "*"
+    csstype: ^3.0.2
+  checksum: dacfde02c260fd98bed2eb775ed0c7ce1397be4c0844f907a50763b081a4008f81f57071889a16eb1350ddcf0927f3cf1a6541702c8ad03de3c70383ef931e3f
+  languageName: node
+  linkType: hard
+
+"@types/react@npm:^16.8.0 || ^17.0.0 || ^18.0.0":
+  version: 18.2.74
+  resolution: "@types/react@npm:18.2.74"
+  dependencies:
+    "@types/prop-types": "*"
+    csstype: ^3.0.2
+  checksum: 093c0e350552e61393e2ba30169aa620e2e64c1e2d0ff38efd2a7549ded689b6ab6bffb65fe0f7ef9e143174de54442d942bd70c014649f464c52465701208d8
+  languageName: node
+  linkType: hard
+
 "@types/react@npm:^18.3.3":
   version: 18.3.3
   resolution: "@types/react@npm:18.3.3"
@@ -9519,6 +9432,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@types/scheduler@npm:*":
+  version: 0.16.2
+  resolution: "@types/scheduler@npm:0.16.2"
+  checksum: b6b4dcfeae6deba2e06a70941860fb1435730576d3689225a421280b7742318d1548b3d22c1f66ab68e414f346a9542f29240bc955b6332c5b11e561077583bc
+  languageName: node
+  linkType: hard
+
 "@types/semver@npm:^7.3.12":
   version: 7.3.13
   resolution: "@types/semver@npm:7.3.13"
@@ -9561,14 +9481,10 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@types/styled-components@npm:^5.1.21":
-  version: 5.1.34
-  resolution: "@types/styled-components@npm:5.1.34"
-  dependencies:
-    "@types/hoist-non-react-statics": "*"
-    "@types/react": "*"
-    csstype: ^3.0.2
-  checksum: 7868066a15afe42d8b353953fc196a7f11a9918b1c980f51d21bb9b49e309c7fe2d730be2d3dc48e92ab4de20f44a3c9dfe6cc98b6ea4dd02655e6f8128171b6
+"@types/stylis@npm:4.2.5":
+  version: 4.2.5
+  resolution: "@types/stylis@npm:4.2.5"
+  checksum: 24f91719db5569979e9e2f197e050ef82e1fd72474e8dc45bca38d48ee56481eae0f0d4a7ac172540d7774b45a2a78d901a4c6d07bba77a33dbccff464ea3edf
   languageName: node
   linkType: hard
 
@@ -11603,7 +11519,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"babel-plugin-styled-components@npm:>= 1.12.0, babel-plugin-styled-components@npm:^2.1.4":
+"babel-plugin-styled-components@npm:^2.1.4":
   version: 2.1.4
   resolution: "babel-plugin-styled-components@npm:2.1.4"
   dependencies:
@@ -12454,7 +12370,6 @@ __metadata:
     "@types/jest-specific-snapshot": ^0.5.9
     "@types/node": ^18.19.59
     "@types/prettier": ^2.4.3
-    "@types/styled-components": ^5.1.21
     "@types/webpack": ^5.28.0
     "@typescript-eslint/eslint-plugin": ^5.55.0
     "@typescript-eslint/parser": ^5.55.0
@@ -12492,7 +12407,7 @@ __metadata:
     storybook: ^8.0.5
     storybook-dark-mode: ^4.0.1
     style-loader: ^3.3.4
-    styled-components: ^5.3.3
+    styled-components: ^6.1.12
     stylelint: ^14.3.0
     stylelint-config-prettier: ^9.0.3
     stylelint-config-recommended: ^6.0.0
@@ -13555,7 +13470,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"css-to-react-native@npm:^3.0.0":
+"css-to-react-native@npm:3.2.0":
   version: 3.2.0
   resolution: "css-to-react-native@npm:3.2.0"
   dependencies:
@@ -13668,6 +13583,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"csstype@npm:3.1.3":
+  version: 3.1.3
+  resolution: "csstype@npm:3.1.3"
+  checksum: 8db785cc92d259102725b3c694ec0c823f5619a84741b5c7991b8ad135dfaa66093038a1cc63e03361a6cd28d122be48f2106ae72334e067dd619a51f49eddf7
+  languageName: node
+  linkType: hard
+
 "csstype@npm:^3.0.2":
   version: 3.0.3
   resolution: "csstype@npm:3.0.3"
@@ -18142,7 +18064,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"hoist-non-react-statics@npm:^3.0.0, hoist-non-react-statics@npm:^3.3.0, hoist-non-react-statics@npm:^3.3.1":
+"hoist-non-react-statics@npm:^3.3.1":
   version: 3.3.2
   resolution: "hoist-non-react-statics@npm:3.3.2"
   dependencies:
@@ -20498,15 +20420,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"jsesc@npm:^3.0.2":
-  version: 3.1.0
-  resolution: "jsesc@npm:3.1.0"
-  bin:
-    jsesc: bin/jsesc
-  checksum: 19c94095ea026725540c0d29da33ab03144f6bcf2d4159e4833d534976e99e0c09c38cefa9a575279a51fc36b31166f8d6d05c9fe2645d5f15851d690b41f17f
-  languageName: node
-  linkType: hard
-
 "jsesc@npm:~0.5.0":
   version: 0.5.0
   resolution: "jsesc@npm:0.5.0"
@@ -26556,7 +26469,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"shallowequal@npm:^1.1.0":
+"shallowequal@npm:1.1.0":
   version: 1.1.0
   resolution: "shallowequal@npm:1.1.0"
   checksum: f4c1de0837f106d2dbbfd5d0720a5d059d1c66b42b580965c8f06bb1db684be8783538b684092648c981294bf817869f743a066538771dbecb293df78f765e00
@@ -27486,25 +27399,23 @@ __metadata:
   languageName: node
   linkType: hard
 
-"styled-components@npm:^5.3.3":
-  version: 5.3.11
-  resolution: "styled-components@npm:5.3.11"
+"styled-components@npm:^6.1.12":
+  version: 6.1.12
+  resolution: "styled-components@npm:6.1.12"
   dependencies:
-    "@babel/helper-module-imports": ^7.0.0
-    "@babel/traverse": ^7.4.5
-    "@emotion/is-prop-valid": ^1.1.0
-    "@emotion/stylis": ^0.8.4
-    "@emotion/unitless": ^0.7.4
-    babel-plugin-styled-components: ">= 1.12.0"
-    css-to-react-native: ^3.0.0
-    hoist-non-react-statics: ^3.0.0
-    shallowequal: ^1.1.0
-    supports-color: ^5.5.0
+    "@emotion/is-prop-valid": 1.2.2
+    "@emotion/unitless": 0.8.1
+    "@types/stylis": 4.2.5
+    css-to-react-native: 3.2.0
+    csstype: 3.1.3
+    postcss: 8.4.38
+    shallowequal: 1.1.0
+    stylis: 4.3.2
+    tslib: 2.6.2
   peerDependencies:
     react: ">= 16.8.0"
     react-dom: ">= 16.8.0"
-    react-is: ">= 16.8.0"
-  checksum: 10edd4dae3b0231ec02d86bdd09c88e894eedfa7e9d4f8e562b09fb69c67a27d586cbcf35c785002d59b3bf11e6c0940b0efce40d13ae9ed148b26b1dc8f3284
+  checksum: ce88075297588ee3910e00d9f8dba09a2d31e6dd0b329d96a7c4afed3d6fddddf6cfb4a29e63b91d7a3137a9e774fafeaaf589237269ea6bd5240a838bdf93e9
   languageName: node
   linkType: hard
 
@@ -27604,6 +27515,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"stylis@npm:4.3.2":
+  version: 4.3.2
+  resolution: "stylis@npm:4.3.2"
+  checksum: 0faa8a97ff38369f47354376cd9f0def9bf12846da54c28c5987f64aaf67dcb6f00dce88a8632013bfb823b2c4d1d62a44f4ac20363a3505a7ab4e21b70179fc
+  languageName: node
+  linkType: hard
+
 "subarg@npm:^1.0.0":
   version: 1.0.0
   resolution: "subarg@npm:1.0.0"
@@ -27630,7 +27548,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"supports-color@npm:^5.3.0, supports-color@npm:^5.5.0":
+"supports-color@npm:^5.3.0":
   version: 5.5.0
   resolution: "supports-color@npm:5.5.0"
   dependencies:
@@ -28388,6 +28306,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"tslib@npm:2.6.2, tslib@npm:^2.0.3":
+  version: 2.6.2
+  resolution: "tslib@npm:2.6.2"
+  checksum: 329ea56123005922f39642318e3d1f0f8265d1e7fcb92c633e0809521da75eeaca28d2cf96d7248229deb40e5c19adf408259f4b9640afd20d13aecc1430f3ad
+  languageName: node
+  linkType: hard
+
 "tslib@npm:^1.13.0":
   version: 1.14.1
   resolution: "tslib@npm:1.14.1"
@@ -28409,13 +28334,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"tslib@npm:^2.0.3":
-  version: 2.6.2
-  resolution: "tslib@npm:2.6.2"
-  checksum: 329ea56123005922f39642318e3d1f0f8265d1e7fcb92c633e0809521da75eeaca28d2cf96d7248229deb40e5c19adf408259f4b9640afd20d13aecc1430f3ad
-  languageName: node
-  linkType: hard
-
 "tslib@npm:^2.1.0":
   version: 2.6.1
   resolution: "tslib@npm:2.6.1"