diff --git a/packages/next/client/future/image.tsx b/packages/next/client/future/image.tsx
index e42a606e21dc3..dc64f1640d66b 100644
--- a/packages/next/client/future/image.tsx
+++ b/packages/next/client/future/image.tsx
@@ -825,10 +825,14 @@ export default function Image({
     imageSrcSetPropName = 'imageSrcSet'
     imageSizesPropName = 'imageSizes'
   }
-  const linkProps = {
+  const linkProps: React.DetailedHTMLProps<
+    React.LinkHTMLAttributes<HTMLLinkElement>,
+    HTMLLinkElement
+  > = {
     // Note: imagesrcset and imagesizes are not in the link element type with react 17.
     [imageSrcSetPropName]: imgAttributes.srcSet,
     [imageSizesPropName]: imgAttributes.sizes,
+    crossOrigin: rest.crossOrigin,
   }
 
   const onLoadingCompleteRef = useRef(onLoadingComplete)
diff --git a/packages/next/client/image.tsx b/packages/next/client/image.tsx
index d986ae3a93c28..4018ca7b7e1f0 100644
--- a/packages/next/client/image.tsx
+++ b/packages/next/client/image.tsx
@@ -978,10 +978,14 @@ export default function Image({
     imageSrcSetPropName = 'imageSrcSet'
     imageSizesPropName = 'imageSizes'
   }
-  const linkProps = {
+  const linkProps: React.DetailedHTMLProps<
+    React.LinkHTMLAttributes<HTMLLinkElement>,
+    HTMLLinkElement
+  > = {
     // Note: imagesrcset and imagesizes are not in the link element type with react 17.
     [imageSrcSetPropName]: imgAttributes.srcSet,
     [imageSizesPropName]: imgAttributes.sizes,
+    crossOrigin: rest.crossOrigin,
   }
 
   const useLayoutEffect =
diff --git a/test/integration/image-component/default/pages/priority.js b/test/integration/image-component/default/pages/priority.js
index 741ae056ea023..975d7a39c2c13 100644
--- a/test/integration/image-component/default/pages/priority.js
+++ b/test/integration/image-component/default/pages/priority.js
@@ -12,6 +12,14 @@ const Page = () => {
         width="400"
         height="400"
       ></Image>
+      <Image
+        priority
+        id="basic-image-with-crossorigin"
+        crossOrigin="anonymous"
+        src="/test.jpg"
+        width="400"
+        height="400"
+      ></Image>
       <Image
         loading="eager"
         id="load-eager"
diff --git a/test/integration/image-component/default/test/index.test.ts b/test/integration/image-component/default/test/index.test.ts
index ba142e1706385..c92422a74413f 100644
--- a/test/integration/image-component/default/test/index.test.ts
+++ b/test/integration/image-component/default/test/index.test.ts
@@ -141,6 +141,11 @@ function runTests(mode) {
       expect(
         await browser.elementById('basic-image').getAttribute('loading')
       ).toBe(null)
+      expect(
+        await browser
+          .elementById('basic-image-with-crossorigin')
+          .getAttribute('loading')
+      ).toBe(null)
       expect(
         await browser.elementById('load-eager').getAttribute('loading')
       ).toBe(null)
@@ -157,6 +162,13 @@ function runTests(mode) {
       expect(warnings).not.toMatch(
         /was detected as the Largest Contentful Paint/gm
       )
+
+      // should preload with crossorigin
+      expect(
+        await browser.elementsByCss(
+          'link[rel=preload][as=image][crossorigin=anonymous][imagesrcset*="test.jpg"]'
+        )
+      ).toHaveLength(1)
     } finally {
       if (browser) {
         await browser.close()
diff --git a/test/integration/image-future/default/pages/priority.js b/test/integration/image-future/default/pages/priority.js
index b851d4f0ebe61..2ef6c1e331dc6 100644
--- a/test/integration/image-future/default/pages/priority.js
+++ b/test/integration/image-future/default/pages/priority.js
@@ -12,6 +12,14 @@ const Page = () => {
         width="400"
         height="400"
       ></Image>
+      <Image
+        priority
+        id="basic-image-crossorigin"
+        src="/test.jpg"
+        width="400"
+        height="400"
+        crossOrigin="anonymous"
+      ></Image>
       <Image
         loading="eager"
         id="load-eager"
diff --git a/test/integration/image-future/default/test/index.test.ts b/test/integration/image-future/default/test/index.test.ts
index c5b3deb535aab..b17de44e23b46 100644
--- a/test/integration/image-future/default/test/index.test.ts
+++ b/test/integration/image-future/default/test/index.test.ts
@@ -157,6 +157,13 @@ function runTests(mode) {
       expect(warnings).not.toMatch(
         /was detected as the Largest Contentful Paint/gm
       )
+
+      // should preload with crossorigin
+      expect(
+        await browser.elementsByCss(
+          'link[rel=preload][as=image][crossorigin=anonymous][imagesrcset*="test.jpg"]'
+        )
+      ).toHaveLength(1)
     } finally {
       if (browser) {
         await browser.close()