diff --git a/scripts/jest/jest.config.js b/scripts/jest/jest.config.js
index ad447fdb77..4a7f6bb249 100644
--- a/scripts/jest/jest.config.js
+++ b/scripts/jest/jest.config.js
@@ -28,6 +28,6 @@ module.exports = {
     testMatch: ['**/__tests__/**/*.test.+(js|jsx|ts|tsx)'],
     testPathIgnorePatterns: ['stories.test.js$', 'stories.test.tsx$', 'stories.test.d.ts'],
     transformIgnorePatterns: [
-        'node_modules/(?!(@box/activity-feed|@box/collaboration-popover|@box/react-virtualized/dist/es|@box/cldr-data|@box/blueprint-web|@box/blueprint-web-assets|@box/metadata-editor|@box/box-ai-content-answers|@box/box-ai-agent-selector|@box/item-icon|@box/combobox-with-api|@box/tree|@box/metadata-filter|@box/metadata-view|@box/content-field|@box/types|@box/box-item-type-selector|@box/unified-share-modal|@box/user-selector|@box/copy-input|@box/readable-time|@box/threaded-annotations)/)',
+        'node_modules/(?!(@box/activity-feed|@box/collaboration-popover|@box/react-virtualized/dist/es|@box/cldr-data|@box/blueprint-web|@box/blueprint-web-assets|@box/metadata-editor|@box/box-ai-content-answers|@box/box-ai-agent-selector|@box/item-icon|@box/combobox-with-api|@box/tree|@box/metadata-filter|@box/metadata-view|@box/content-field|@box/types|@box/box-item-type-selector|@box/unified-share-modal|@box/user-selector|@box/copy-input|@box/readable-time|@box/threaded-annotations|@box/uploads-manager)/)',
     ],
 };
diff --git a/src/elements/content-uploader/ContentUploader.tsx b/src/elements/content-uploader/ContentUploader.tsx
index f177e7cd81..9923bf3ced 100644
--- a/src/elements/content-uploader/ContentUploader.tsx
+++ b/src/elements/content-uploader/ContentUploader.tsx
@@ -6,6 +6,7 @@ import flow from 'lodash/flow';
 import getProp from 'lodash/get';
 import noop from 'lodash/noop';
 import uniqueid from 'lodash/uniqueId';
+import { UploadsManager as UploadsManagerBP } from '@box/uploads-manager';
 import { TooltipProvider } from '@box/blueprint-web';
 import { AxiosRequestConfig, AxiosResponse } from 'axios';
 import DroppableContent from './DroppableContent';
@@ -104,6 +105,7 @@ export interface ContentUploaderProps {
     token?: Token;
     uploadHost: string;
     useUploadsManager?: boolean;
+    enableModernizedUploads?: boolean;
 }
 
 type State = {
@@ -169,6 +171,7 @@ class ContentUploader extends Component<ContentUploaderProps, State> {
         rootFolderId: DEFAULT_ROOT,
         uploadHost: DEFAULT_HOSTNAME_UPLOAD,
         useUploadsManager: false,
+        enableModernizedUploads: false,
     };
 
     /**
@@ -1268,6 +1271,7 @@ class ContentUploader extends Component<ContentUploaderProps, State> {
     render() {
         const {
             className,
+            enableModernizedUploads,
             fileLimit,
             isDraggingItemsToUploadsManager = false,
             isFolderUploadEnabled,
@@ -1294,51 +1298,68 @@ class ContentUploader extends Component<ContentUploaderProps, State> {
             be: !useUploadsManager,
         });
 
+        const renderUploader = () => {
+            if (enableModernizedUploads) {
+                return (
+                    <div ref={measureRef} className={styleClassName} id={this.id}>
+                        <ThemingStyles selector={`#${this.id}`} theme={theme} />
+                        <UploadsManagerBP items={[]} />
+                    </div>
+                );
+            }
+
+            if (useUploadsManager) {
+                return (
+                    <div ref={measureRef} className={styleClassName} id={this.id}>
+                        <ThemingStyles selector={`#${this.id}`} theme={theme} />
+                        <UploadsManager
+                            isDragging={isDraggingItemsToUploadsManager}
+                            isExpanded={isUploadsManagerExpanded}
+                            isResumableUploadsEnabled={isResumableUploadsEnabled}
+                            isVisible={isVisible}
+                            items={items}
+                            onItemActionClick={this.onClick}
+                            onRemoveActionClick={this.removeFileFromUploadQueue}
+                            onUpgradeCTAClick={onUpgradeCTAClick}
+                            onUploadsManagerActionClick={this.clickAllWithStatus}
+                            toggleUploadsManager={this.toggleUploadsManager}
+                            view={view}
+                        />
+                    </div>
+                )
+            }
+ 
+            return (
+                <div ref={measureRef} className={styleClassName} id={this.id}>
+                    <ThemingStyles selector={`#${this.id}`} theme={theme} />
+                    <DroppableContent
+                        addDataTransferItemsToUploadQueue={this.addDroppedItemsToUploadQueue}
+                        addFiles={this.addFilesToUploadQueue}
+                        allowedTypes={['Files']}
+                        isFolderUploadEnabled={isFolderUploadEnabled}
+                        isTouch={isTouch}
+                        items={items}
+                        onClick={this.onClick}
+                        view={view}
+                    />
+                    <Footer
+                        errorCode={errorCode}
+                        fileLimit={fileLimit}
+                        hasFiles={hasFiles}
+                        isLoading={isLoading}
+                        onCancel={this.cancel}
+                        onClose={onClose}
+                        onUpload={this.upload}
+                        isDone={isDone}
+                    />
+                </div>
+            )
+        }
+
         return (
             <Internationalize language={language} messages={messages}>
                 <TooltipProvider>
-                    {useUploadsManager ? (
-                        <div ref={measureRef} className={styleClassName} id={this.id}>
-                            <ThemingStyles selector={`#${this.id}`} theme={theme} />
-                            <UploadsManager
-                                isDragging={isDraggingItemsToUploadsManager}
-                                isExpanded={isUploadsManagerExpanded}
-                                isResumableUploadsEnabled={isResumableUploadsEnabled}
-                                isVisible={isVisible}
-                                items={items}
-                                onItemActionClick={this.onClick}
-                                onRemoveActionClick={this.removeFileFromUploadQueue}
-                                onUpgradeCTAClick={onUpgradeCTAClick}
-                                onUploadsManagerActionClick={this.clickAllWithStatus}
-                                toggleUploadsManager={this.toggleUploadsManager}
-                                view={view}
-                            />
-                        </div>
-                    ) : (
-                        <div ref={measureRef} className={styleClassName} id={this.id}>
-                            <ThemingStyles selector={`#${this.id}`} theme={theme} />
-                            <DroppableContent
-                                addDataTransferItemsToUploadQueue={this.addDroppedItemsToUploadQueue}
-                                addFiles={this.addFilesToUploadQueue}
-                                allowedTypes={['Files']}
-                                isFolderUploadEnabled={isFolderUploadEnabled}
-                                isTouch={isTouch}
-                                items={items}
-                                onClick={this.onClick}
-                                view={view}
-                            />
-                            <Footer
-                                errorCode={errorCode}
-                                fileLimit={fileLimit}
-                                hasFiles={hasFiles}
-                                isLoading={isLoading}
-                                onCancel={this.cancel}
-                                onClose={onClose}
-                                onUpload={this.upload}
-                                isDone={isDone}
-                            />
-                        </div>
-                    )}
+                    {renderUploader()}
                 </TooltipProvider>
             </Internationalize>
         );
diff --git a/src/elements/content-uploader/__tests__/ContentUploader.test.js b/src/elements/content-uploader/__tests__/ContentUploader.test.js
index 89667096d4..10b0afefcc 100644
--- a/src/elements/content-uploader/__tests__/ContentUploader.test.js
+++ b/src/elements/content-uploader/__tests__/ContentUploader.test.js
@@ -1,9 +1,12 @@
 import * as React from 'react';
 import { shallow } from 'enzyme';
+import { UploadsManager as UploadsManagerBP } from '@box/uploads-manager';
 import * as UploaderUtils from '../../../utils/uploads';
 import Browser from '../../../utils/Browser';
 import { ContentUploaderComponent, CHUNKED_UPLOAD_MIN_SIZE_BYTES } from '../ContentUploader';
 import Footer from '../Footer';
+import UploadsManager from '../UploadsManager';
+import DroppableContent from '../DroppableContent';
 import {
     STATUS_PENDING,
     STATUS_IN_PROGRESS,
@@ -755,4 +758,36 @@ describe('elements/content-uploader/ContentUploader', () => {
             expect(instance.addToQueue.mock.calls[0][0].length).toBe(mockFoldersList.length);
         });
     });
+
+    describe('render()', () => {
+        describe('enableModernizedUploads', () => {
+            test('should render legacy UploadsManager when enableModernizedUploads is false and useUploadsManager is true', () => {
+                const wrapper = getWrapper({ enableModernizedUploads: false, useUploadsManager: true });
+                expect(wrapper.find(UploadsManager)).toHaveLength(1);
+                expect(wrapper.find(UploadsManagerBP)).toHaveLength(0);
+                expect(wrapper.find(DroppableContent)).toHaveLength(0);
+            });
+
+            test('should render DroppableContent when enableModernizedUploads is false and useUploadsManager is false', () => {
+                const wrapper = getWrapper({ enableModernizedUploads: false, useUploadsManager: false });
+                expect(wrapper.find(DroppableContent)).toHaveLength(1);
+                expect(wrapper.find(UploadsManager)).toHaveLength(0);
+                expect(wrapper.find(UploadsManagerBP)).toHaveLength(0);
+            });
+
+            test('should render modernized UploadsManager when enableModernizedUploads is true', () => {
+                const wrapper = getWrapper({ enableModernizedUploads: true });
+                expect(wrapper.find(UploadsManagerBP)).toHaveLength(1);
+                expect(wrapper.find(UploadsManager)).toHaveLength(0);
+                expect(wrapper.find(DroppableContent)).toHaveLength(0);
+            });
+
+            test('should render modernized UploadsManager when enableModernizedUploads is true and useUploadsManager is true', () => {
+                const wrapper = getWrapper({ enableModernizedUploads: true, useUploadsManager: true });
+                expect(wrapper.find(UploadsManagerBP)).toHaveLength(1);
+                expect(wrapper.find(UploadsManager)).toHaveLength(0);
+                expect(wrapper.find(DroppableContent)).toHaveLength(0);
+            });
+        });
+    });
 });
diff --git a/src/elements/content-uploader/stories/ContentUploader.stories.js b/src/elements/content-uploader/stories/ContentUploader.stories.js
index 6ddd6f8591..693d44d0a0 100644
--- a/src/elements/content-uploader/stories/ContentUploader.stories.js
+++ b/src/elements/content-uploader/stories/ContentUploader.stories.js
@@ -10,6 +10,12 @@ export const withTheming = {
     },
 };
 
+export const withModernizedUploads = {
+    args: {
+        enableModernizedUploads: true,
+    },
+};
+
 export default {
     title: 'Elements/ContentUploader',
     component: ContentUploader,