diff --git a/.changeset/few-coats-smash.md b/.changeset/few-coats-smash.md
new file mode 100644
index 00000000..012d5d63
--- /dev/null
+++ b/.changeset/few-coats-smash.md
@@ -0,0 +1,5 @@
+---
+'playroom': patch
+---
+
+Replace `polished` dependency with CSS relative color syntax and `color-mix`
diff --git a/package.json b/package.json
index d7e94316..0f77b664 100644
--- a/package.json
+++ b/package.json
@@ -99,7 +99,6 @@
     "memoize-one": "^6.0.0",
     "mini-css-extract-plugin": "^2.7.2",
     "parse-prop-types": "^0.3.0",
-    "polished": "^4.2.2",
     "portfinder": "^1.0.32",
     "prettier": "^2.8.1",
     "prop-types": "^15.8.1",
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 0eb6ae7a..7fb7b6a0 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -110,9 +110,6 @@ dependencies:
   parse-prop-types:
     specifier: ^0.3.0
     version: 0.3.0(prop-types@15.8.1)
-  polished:
-    specifier: ^4.2.2
-    version: 4.2.2
   portfinder:
     specifier: ^1.0.32
     version: 1.0.32
@@ -8284,13 +8281,6 @@ packages:
       pathe: 1.1.2
     dev: false
 
-  /polished@4.2.2:
-    resolution: {integrity: sha512-Sz2Lkdxz6F2Pgnpi9U5Ng/WdWAUZxmHrNPoVlm3aAemxoy2Qy7LGjQg4uf8qKelDAUW94F4np3iH2YPf2qefcQ==}
-    engines: {node: '>=10'}
-    dependencies:
-      '@babel/runtime': 7.20.6
-    dev: false
-
   /portfinder@1.0.32:
     resolution: {integrity: sha512-on2ZJVVDXRADWE6jnQaX0ioEylzgBpQk8r55NE4wjXW1ZxO+BgDlY6DXwj20i0V8eB4SenDQ00WEaxfiIQPcxg==}
     engines: {node: '>= 0.12.0'}
diff --git a/src/Playroom/palettes.ts b/src/Playroom/palettes.ts
index a1ca3eb3..427f360b 100644
--- a/src/Playroom/palettes.ts
+++ b/src/Playroom/palettes.ts
@@ -1,5 +1,3 @@
-import { transparentize, mix, darken } from 'polished';
-
 const originalPalette = {
   blue0: '#e5f3ff',
   blue1: '#0088ff',
@@ -22,6 +20,35 @@ const originalPalette = {
   black: '#000',
 };
 
+const guard = (amount: number) => {
+  if (amount > 1 || amount < 0) {
+    throw new Error('Amount must be between 0 and 1 inclusive');
+  }
+
+  return amount;
+};
+
+/**
+ * Implementation of `transparentize` from polished but using native CSS
+ * @see https://polished.js.org/docs/#transparentize
+ */
+const transparentize = (amount: number, color: string) =>
+  `rgb(from ${color} r g b / calc(alpha - ${guard(amount)}))`;
+
+/**
+ * Implementation of `darken` from polished but using native CSS
+ * @see https://polished.js.org/docs/#darken
+ */
+const darken = (amount: number, color: string) =>
+  `hsl(from ${color} h s calc(l - ${guard(amount) * 100}))`;
+
+/**
+ * Implementation of `mix` from polished but using native CSS
+ * @see https://polished.js.org/docs/#mix
+ */
+const mix = (amount: number, color1: string, color2: string) =>
+  `color-mix(in srgb, ${color1} ${guard(amount) * 100}%, ${color2})`;
+
 export const light = {
   code: {
     text: originalPalette.black,