diff --git a/.yarn/cache/@framer-plugin-npm-4.0.0-341aae11c3-5c1ad07452.zip b/.yarn/cache/@framer-plugin-npm-4.0.0-341aae11c3-5c1ad07452.zip
new file mode 100644
index 000000000..f55af7b73
Binary files /dev/null and b/.yarn/cache/@framer-plugin-npm-4.0.0-341aae11c3-5c1ad07452.zip differ
diff --git a/.yarn/cache/es-module-lexer-npm-1.7.0-456b47a08a-b6f3e576a3.zip b/.yarn/cache/es-module-lexer-npm-1.7.0-456b47a08a-b6f3e576a3.zip
deleted file mode 100644
index 2896c7066..000000000
Binary files a/.yarn/cache/es-module-lexer-npm-1.7.0-456b47a08a-b6f3e576a3.zip and /dev/null differ
diff --git a/.yarn/cache/framer-plugin-npm-3.10.3-f82e9d58a5-c677a26146.zip b/.yarn/cache/framer-plugin-npm-3.10.3-f82e9d58a5-c677a26146.zip
deleted file mode 100644
index 0d9ed6da3..000000000
Binary files a/.yarn/cache/framer-plugin-npm-3.10.3-f82e9d58a5-c677a26146.zip and /dev/null differ
diff --git a/.yarn/cache/parse-imports-npm-3.0.0-79f1970b0f-0ebba4405e.zip b/.yarn/cache/parse-imports-npm-3.0.0-79f1970b0f-0ebba4405e.zip
deleted file mode 100644
index 9f4e9e001..000000000
Binary files a/.yarn/cache/parse-imports-npm-3.0.0-79f1970b0f-0ebba4405e.zip and /dev/null differ
diff --git a/.yarn/cache/slashes-npm-3.0.12-28822614a6-c221d73765.zip b/.yarn/cache/slashes-npm-3.0.12-28822614a6-c221d73765.zip
deleted file mode 100644
index 9f1191467..000000000
Binary files a/.yarn/cache/slashes-npm-3.0.12-28822614a6-c221d73765.zip and /dev/null differ
diff --git a/starters/cms/package.json b/starters/cms/package.json
index 4d4fbb163..0102dbd1e 100644
--- a/starters/cms/package.json
+++ b/starters/cms/package.json
@@ -15,7 +15,7 @@
         "preview": "vite preview"
     },
     "dependencies": {
-        "framer-plugin": "^3.10.0",
+        "@framer/plugin": "^4",
         "react": "^18.3.1",
         "react-dom": "^18.3.1"
     },
diff --git a/starters/cms/src/App.tsx b/starters/cms/src/App.tsx
index bee3cbd10..2d6399c8d 100644
--- a/starters/cms/src/App.tsx
+++ b/starters/cms/src/App.tsx
@@ -1,6 +1,6 @@
 import "./App.css"
 
-import { framer, type ManagedCollection } from "framer-plugin"
+import { framer, type ManagedCollection } from "@framer/plugin"
 import { useEffect, useLayoutEffect, useState } from "react"
 import { type DataSource, getDataSource } from "./data"
 import { FieldMapping } from "./FieldMapping"
diff --git a/starters/cms/src/FieldMapping.tsx b/starters/cms/src/FieldMapping.tsx
index 10071a745..11a5f6ddf 100644
--- a/starters/cms/src/FieldMapping.tsx
+++ b/starters/cms/src/FieldMapping.tsx
@@ -1,4 +1,4 @@
-import { framer, type ManagedCollection, type ManagedCollectionFieldInput, useIsAllowedTo } from "framer-plugin"
+import { framer, type ManagedCollection, type ManagedCollectionFieldInput, useIsAllowedTo } from "@framer/plugin"
 import { useCallback, useEffect, useMemo, useState } from "react"
 import { type DataSource, dataSourceOptions, mergeFieldsWithExistingFields, syncCollection, syncMethods } from "./data"
 
diff --git a/starters/cms/src/SelectDataSource.tsx b/starters/cms/src/SelectDataSource.tsx
index cc790d3f7..d377d2422 100644
--- a/starters/cms/src/SelectDataSource.tsx
+++ b/starters/cms/src/SelectDataSource.tsx
@@ -1,4 +1,4 @@
-import { framer } from "framer-plugin"
+import { framer } from "@framer/plugin"
 import { useState } from "react"
 import { type DataSource, dataSourceOptions, getDataSource } from "./data"
 
diff --git a/starters/cms/src/data.ts b/starters/cms/src/data.ts
index 87b90a5d4..713b20d95 100644
--- a/starters/cms/src/data.ts
+++ b/starters/cms/src/data.ts
@@ -5,7 +5,7 @@ import {
     type ManagedCollectionFieldInput,
     type ManagedCollectionItemInput,
     type ProtectedMethod,
-} from "framer-plugin"
+} from "@framer/plugin"
 
 export const PLUGIN_KEYS = {
     DATA_SOURCE_ID: "dataSourceId",
diff --git a/starters/cms/src/main.tsx b/starters/cms/src/main.tsx
index e032a79bb..29e443f24 100644
--- a/starters/cms/src/main.tsx
+++ b/starters/cms/src/main.tsx
@@ -1,6 +1,6 @@
-import "framer-plugin/framer.css"
+import "@framer/plugin/framer.css"
 
-import { framer } from "framer-plugin"
+import { framer } from "@framer/plugin"
 import { StrictMode } from "react"
 import { createRoot } from "react-dom/client"
 import { App } from "./App.tsx"
diff --git a/yarn.lock b/yarn.lock
index ab10b21de..f06b1302f 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -753,6 +753,17 @@ __metadata:
   languageName: unknown
   linkType: soft
 
+"@framer/plugin@npm:^4":
+  version: 4.0.0
+  resolution: "@framer/plugin@npm:4.0.0"
+  peerDependencies:
+    csstype: ^3.1.1
+    react: ^18.2.0
+    react-dom: ^18.2.0
+  checksum: 10/5c1ad07452d71732d469e6badaf4b925b5c6ef1872e58768a1debffefbc925dabd2cff94b07def43548fcd8a4a598195c6c5fcd36a121c711be46c6e7f68167b
+  languageName: node
+  linkType: hard
+
 "@framer/vite-config@workspace:*, @framer/vite-config@workspace:packages/vite-config":
   version: 0.0.0-use.local
   resolution: "@framer/vite-config@workspace:packages/vite-config"
@@ -3822,13 +3833,13 @@ __metadata:
   resolution: "cms-starter@workspace:starters/cms"
   dependencies:
     "@eslint/js": "npm:^9.35.0"
+    "@framer/plugin": "npm:^4"
     "@types/react": "npm:^18.3.24"
     "@types/react-dom": "npm:^18.3.7"
     "@vitejs/plugin-react": "npm:^6.0.1"
     eslint: "npm:^9.35.0"
     eslint-plugin-react-hooks: "npm:^5.2.0"
     eslint-plugin-react-refresh: "npm:^0.4.20"
-    framer-plugin: "npm:^3.10.0"
     globals: "npm:^16.4.0"
     jiti: "npm:^2.5.1"
     prettier: "npm:^3.6.2"
@@ -5081,16 +5092,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"framer-plugin@npm:^3.10.0":
-  version: 3.10.3
-  resolution: "framer-plugin@npm:3.10.3"
-  peerDependencies:
-    react: ^18.2.0
-    react-dom: ^18.2.0
-  checksum: 10/c677a261461cc3a79605cd74fc9de746de7c32e531a0c6a7aba0d5794af1c6c194cdea3576a6e74034c0228e7cc5a8ca8b0e40c213fe85e0dacece7cc01ce6c2
-  languageName: node
-  linkType: hard
-
 "fs-minipass@npm:^3.0.0":
   version: 3.0.3
   resolution: "fs-minipass@npm:3.0.3"