diff --git a/config/stylelint.config.js b/config/stylelint.config.js
index 7c42d873..02381e81 100644
--- a/config/stylelint.config.js
+++ b/config/stylelint.config.js
@@ -1,4 +1,5 @@
 module.exports = {
+    customSyntax: 'postcss-styled-jsx',
     plugins: ['stylelint-use-logical'],
     rules: {
         'csstools/use-logical': [
diff --git a/package.json b/package.json
index 4f9fb5b2..7fe1596d 100644
--- a/package.json
+++ b/package.json
@@ -41,6 +41,9 @@
         "husky": "^7.0.2",
         "micromatch": "^4.0.4",
         "perfy": "^1.1.5",
+        "postcss": "^8.4.38",
+        "postcss-styled-jsx": "^1.0.1",
+        "postcss-syntax": "^0.36.2",
         "prettier": "^2.4.1",
         "semver": "^7.3.5",
         "stylelint": "^16.3.1",
diff --git a/yarn.lock b/yarn.lock
index e452a61c..e42a197c 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -4479,6 +4479,16 @@ postcss-selector-parser@^6.0.16:
     cssesc "^3.0.0"
     util-deprecate "^1.0.2"
 
+postcss-styled-jsx@^1.0.1:
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/postcss-styled-jsx/-/postcss-styled-jsx-1.0.1.tgz#07c17ca3bc574a06627103bb5dd475006c2d0d9e"
+  integrity sha512-508Vg2A0pHQstRxz8eoNYiT+RiCZdgE4EqN0x8oiPIZ/a6pp5q2NYefL39RRG8ORlxDehLHU3u/EOpux0kuATQ==
+
+postcss-syntax@^0.36.2:
+  version "0.36.2"
+  resolved "https://registry.yarnpkg.com/postcss-syntax/-/postcss-syntax-0.36.2.tgz#f08578c7d95834574e5593a82dfbfa8afae3b51c"
+  integrity sha512-nBRg/i7E3SOHWxF3PpF5WnJM/jQ1YpY9000OaVXlAQj6Zp/kIqJxEDWIZ67tAd7NLuk7zqN4yqe9nc0oNAOs1w==
+
 postcss-value-parser@^4.2.0:
   version "4.2.0"
   resolved "https://registry.yarnpkg.com/postcss-value-parser/-/postcss-value-parser-4.2.0.tgz#723c09920836ba6d3e5af019f92bc0971c02e514"