diff --git a/changelog/unreleased/enhancement-redesign-create-upload-buttons b/changelog/unreleased/enhancement-redesign-create-upload-buttons
new file mode 100644
index 00000000000..581e50dd641
--- /dev/null
+++ b/changelog/unreleased/enhancement-redesign-create-upload-buttons
@@ -0,0 +1,7 @@
+Enhancement: Redesign create and upload buttons
+
+We have separated the "Create new file/folder" and "Upload" actions above the files list into two separate buttons,
+also using the new resource type icons for more consistency.
+
+https://github.com/owncloud/web/issues/6279
+https://github.com/owncloud/web/pull/6358
diff --git a/packages/web-app-draw-io/src/index.js b/packages/web-app-draw-io/src/index.js
index 32f90039321..96e059c72db 100644
--- a/packages/web-app-draw-io/src/index.js
+++ b/packages/web-app-draw-io/src/index.js
@@ -24,7 +24,7 @@ const appInfo = {
       routeName: 'draw-io',
       newFileMenu: {
         menuTitle($gettext) {
-          return $gettext('New draw.io document…')
+          return $gettext('Draw.io document')
         }
       }
     },
diff --git a/packages/web-app-files/src/components/AppBar/AppBar.vue b/packages/web-app-files/src/components/AppBar/AppBar.vue
index 8ebf1f4c36e..c67b37ee188 100644
--- a/packages/web-app-files/src/components/AppBar/AppBar.vue
+++ b/packages/web-app-files/src/components/AppBar/AppBar.vue
@@ -30,31 +30,114 @@
         <div
           v-if="showActions || selectedFiles.length > 0 || hasBulkActions"
           class="oc-flex-1 oc-flex oc-flex-start"
+          style="gap: 15px"
         >
           <template v-if="showActions && areDefaultActionsVisible">
+            <template v-if="createFileActionsAvailable">
+              <oc-button
+                id="new-file-menu-btn"
+                key="new-file-menu-btn-enabled"
+                v-oc-tooltip="newButtonTooltip"
+                :aria-label="newButtonAriaLabel"
+                variation="inverse"
+                :disabled="uploadOrFileCreationBlocked"
+                class="oc-background-primary-gradient"
+              >
+                <oc-icon name="add" />
+                <translate>New</translate>
+              </oc-button>
+              <oc-drop
+                drop-id="new-file-menu-drop"
+                toggle="#new-file-menu-btn"
+                mode="click"
+                close-on-click
+                class="oc-width-auto"
+                padding-size="small"
+              >
+                <oc-list id="create-list">
+                  <li class="create-list-folder oc-py-xs">
+                    <oc-button
+                      id="new-folder-btn"
+                      appearance="raw"
+                      @click="showCreateResourceModal"
+                    >
+                      <oc-resource-icon :resource="{ isFolder: true, extension: '' }" />
+                      <translate>Folder</translate>
+                    </oc-button>
+                  </li>
+                  <li
+                    v-for="(newFileHandler, key) in newFileHandlersForRoute"
+                    :key="key"
+                    class="create-list-file oc-py-xs"
+                  >
+                    <oc-button
+                      appearance="raw"
+                      :class="['new-file-btn-' + newFileHandler.ext]"
+                      @click="
+                        showCreateResourceModal(false, newFileHandler.ext, newFileHandler.action)
+                      "
+                    >
+                      <oc-resource-icon
+                        :resource="{ type: 'file', extension: newFileHandler.ext }"
+                      />
+                      <span>{{ newFileHandler.menuTitle($gettext) }}</span>
+                    </oc-button>
+                  </li>
+                  <template v-if="mimetypesAllowedForCreation">
+                    <li
+                      v-for="(mimetype, key) in mimetypesAllowedForCreation"
+                      :key="key"
+                      class="create-list-file oc-py-xs"
+                    >
+                      <oc-button
+                        appearance="raw"
+                        @click="showCreateResourceModal(false, mimetype.ext, false, true)"
+                      >
+                        <oc-resource-icon :resource="{ type: 'file', extension: mimetype.ext }" />
+                        <translate :translate-params="{ name: mimetype.name }">%{name}</translate>
+                      </oc-button>
+                    </li>
+                  </template>
+                </oc-list>
+              </oc-drop>
+            </template>
+            <template v-else>
+              <oc-button
+                id="new-folder-btn"
+                v-oc-tooltip="newButtonAriaLabel"
+                variation="inverse"
+                :aria-label="newButtonAriaLabel"
+                :disabled="uploadOrFileCreationBlocked"
+                class="oc-background-primary-gradient"
+                @click="showCreateResourceModal"
+              >
+                <oc-icon name="resource-type-folder" />
+                <translate style="display: ruby">New folder</translate>
+              </oc-button>
+            </template>
             <oc-button
-              id="new-file-menu-btn"
-              key="new-file-menu-btn-enabled"
-              v-oc-tooltip="newButtonTooltip"
-              :aria-label="newButtonAriaLabel"
-              variation="inverse"
-              :disabled="isNewBtnDisabled"
-              class="oc-background-primary-gradient"
+              id="upload-menu-btn"
+              key="upload-menu-btn-enabled"
+              v-oc-tooltip="uploadButtonTooltip"
+              :aria-label="uploadButtonAriaLabel"
+              :disabled="uploadOrFileCreationBlocked"
             >
-              <oc-icon name="add" />
-              <translate>New</translate>
+              <oc-icon name="upload" fill-type="line" />
+              <translate>Upload</translate>
             </oc-button>
             <oc-drop
-              drop-id="new-file-menu-drop"
-              toggle="#new-file-menu-btn"
+              drop-id="upload-menu-drop"
+              toggle="#upload-menu-btn"
               mode="click"
+              class="oc-width-auto"
               close-on-click
-              :options="{ delayHide: 0 }"
               padding-size="small"
             >
-              <ul class="oc-list">
-                <li class="oc-my-xs">
-                  <file-upload
+              <oc-list id="upload-list">
+                <li class="oc-p-s">
+                  <folder-upload
+                    v-if="!isIE11()"
+                    :root-path="currentPath"
                     :path="currentPath"
                     :headers="headers"
                     @success="onFileSuccess"
@@ -62,10 +145,8 @@
                     @progress="onFileProgress"
                   />
                 </li>
-                <li v-if="checkIfBrowserSupportsFolderUpload">
-                  <folder-upload
-                    v-if="!isIE11()"
-                    :root-path="currentPath"
+                <li class="oc-p-s">
+                  <file-upload
                     :path="currentPath"
                     :headers="headers"
                     @success="onFileSuccess"
@@ -73,53 +154,7 @@
                     @progress="onFileProgress"
                   />
                 </li>
-                <li>
-                  <div>
-                    <oc-button
-                      id="new-folder-btn"
-                      appearance="raw"
-                      class="oc-width-1-1"
-                      justify-content="left"
-                      @click="showCreateResourceModal"
-                    >
-                      <oc-icon name="folder-add" />
-                      <translate>New folder…</translate>
-                    </oc-button>
-                  </div>
-                </li>
-                <li v-for="(newFileHandler, key) in newFileHandlersForRoute" :key="key">
-                  <div>
-                    <oc-button
-                      appearance="raw"
-                      justify-content="left"
-                      :class="['new-file-btn-' + newFileHandler.ext, 'oc-width-1-1']"
-                      @click="
-                        showCreateResourceModal(false, newFileHandler.ext, newFileHandler.action)
-                      "
-                    >
-                      <oc-icon :name="newFileHandler.icon || 'save'" />
-                      <span>{{ newFileHandler.menuTitle($gettext) }}</span>
-                    </oc-button>
-                  </div>
-                </li>
-                <template v-if="mimetypesAllowedForCreation">
-                  <li v-for="(mimetype, key) in mimetypesAllowedForCreation" :key="key">
-                    <div>
-                      <oc-button
-                        appearance="raw"
-                        justify-content="left"
-                        :class="['oc-width-1-1']"
-                        @click="showCreateResourceModal(false, mimetype.ext, false, true)"
-                      >
-                        <oc-icon :name="mimetype.icon || 'file'" />
-                        <translate :translate-params="{ name: mimetype.name }"
-                          >New %{name}</translate
-                        >
-                      </oc-button>
-                    </div>
-                  </li>
-                </template>
-              </ul>
+              </oc-list>
             </oc-drop>
           </template>
           <size-info v-if="hasBulkActions && selectedFiles.length > 0" class="oc-mr oc-visible@l" />
@@ -195,12 +230,15 @@ export default {
       }
       return mimeTypes.filter((mimetype) => mimetype.allow_creation) || []
     },
+    createFileActionsAvailable() {
+      return this.newFileHandlersForRoute.length > 0 || this.mimetypesAllowedForCreation.length > 0
+    },
     newButtonTooltip() {
       if (!this.canUpload) {
-        return this.$gettext('You have no permission to upload!')
+        return this.$gettext('You have no permission to create new files!')
       }
       if (!this.hasFreeSpace) {
-        return this.$gettext('You have not enough space left to upload!')
+        return this.$gettext('You have not enough space left to create new files!')
       }
       return null
     },
@@ -209,7 +247,26 @@ export default {
       if (tooltip) {
         return tooltip
       }
-      return this.$gettext('Add files or folders')
+      if (!this.createFileActionsAvailable) {
+        return this.$gettext('Create a new folder')
+      }
+      return this.$gettext('Create new files or folders')
+    },
+    uploadButtonTooltip() {
+      if (!this.canUpload) {
+        return this.$gettext('You have no permission to upload!')
+      }
+      if (!this.hasFreeSpace) {
+        return this.$gettext('You have not enough space left to upload!')
+      }
+      return null
+    },
+    uploadButtonAriaLabel() {
+      const tooltip = this.uploadButtonTooltip
+      if (tooltip) {
+        return tooltip
+      }
+      return this.$gettext('Upload files or folders')
     },
 
     currentPath() {
@@ -331,7 +388,7 @@ export default {
       return this.selectedFiles.length < 1
     },
 
-    isNewBtnDisabled() {
+    uploadOrFileCreationBlocked() {
       return !this.canUpload || !this.hasFreeSpace
     },
 
@@ -372,6 +429,7 @@ export default {
 
     showCreateResourceModal(
       isFolder = true,
+      // why default to txt file in line below?
       ext = 'txt',
       openAction = null,
       addAppProviderFile = false
@@ -402,6 +460,7 @@ export default {
           ? this.checkNewFolderName(defaultName)
           : this.checkNewFileName(defaultName),
         onCancel: this.hideModal,
+        // what happens below looks wrong, I don't get it
         onConfirm: isFolder
           ? this.addNewFolder
           : addAppProviderFile
@@ -562,6 +621,7 @@ export default {
     async addAppProviderFile(fileName) {
       // FIXME: this belongs in web-app-external, but the app provider handles file creation differently than other editor extensions. Needs more refactoring.
       if (fileName === '') {
+        // shouldn't we show an error here?
         return
       }
       try {
@@ -739,6 +799,23 @@ export default {
     display: flex;
     gap: var(--oc-space-small);
     justify-content: flex-end;
+
+    #create-list {
+      li {
+        border: 1px solid transparent;
+        button {
+          gap: 10px;
+          justify-content: left;
+          width: 100%;
+        }
+      }
+      .create-list-folder {
+        border-bottom: 1px solid var(--oc-color-border);
+      }
+      .create-list-file button {
+        margin: 2px 0;
+      }
+    }
   }
 }
 </style>
diff --git a/packages/web-app-files/src/components/AppBar/Upload/FileUpload.vue b/packages/web-app-files/src/components/AppBar/Upload/FileUpload.vue
index 271a9ad6fae..3303719fdf9 100644
--- a/packages/web-app-files/src/components/AppBar/Upload/FileUpload.vue
+++ b/packages/web-app-files/src/components/AppBar/Upload/FileUpload.vue
@@ -1,8 +1,8 @@
 <template>
   <div>
     <oc-button class="oc-width-1-1" justify-content="left" appearance="raw" @click="triggerUpload">
-      <oc-icon name="upload" fill-type="line" />
-      <span id="files-file-upload-button" v-translate>Upload File</span>
+      <oc-resource-icon :resource="{ extension: '' }" />
+      <span id="files-file-upload-button" v-translate>Files</span>
     </oc-button>
     <input
       id="fileUploadInput"
diff --git a/packages/web-app-files/src/components/AppBar/Upload/FolderUpload.vue b/packages/web-app-files/src/components/AppBar/Upload/FolderUpload.vue
index cc6d0bab06d..5201e609d5a 100644
--- a/packages/web-app-files/src/components/AppBar/Upload/FolderUpload.vue
+++ b/packages/web-app-files/src/components/AppBar/Upload/FolderUpload.vue
@@ -1,8 +1,8 @@
 <template>
   <div>
     <oc-button class="oc-width-1-1" justify-content="left" appearance="raw" @click="triggerUpload">
-      <oc-icon name="upload-cloud" />
-      <span id="files-folder-upload-button" v-translate>Upload Folder</span>
+      <oc-resource-icon :resource="{ isFolder: true, extension: '' }" />
+      <span id="files-folder-upload-button" v-translate>Folder</span>
     </oc-button>
     <input
       id="folderUploadInput"
diff --git a/packages/web-app-files/tests/unit/components/AppBar/AppBar.spec.js b/packages/web-app-files/tests/unit/components/AppBar/AppBar.spec.js
index fedd1434a5a..d851b5e7415 100644
--- a/packages/web-app-files/tests/unit/components/AppBar/AppBar.spec.js
+++ b/packages/web-app-files/tests/unit/components/AppBar/AppBar.spec.js
@@ -24,8 +24,11 @@ const elSelector = {
   batchActions: 'batch-actions-stub',
   sizeInfo: 'size-info-stub',
   newFileButton: '#new-file-menu-btn',
-  ocDrop: 'oc-drop-stub',
-  fileMenuList: 'oc-drop-stub .oc-list > li',
+  newFileDrop: 'oc-drop-stub #new-file-menu-drop',
+  newFileMenuList: '#create-list > li',
+  uploadButton: '#upload-menu-btn',
+  uploadDrop: 'oc-drop-stub #upload-menu-drop',
+  uploadMenuList: '#upload-list > li',
   fileUpload: 'file-upload-stub',
   folderUpload: 'folder-upload-stub',
   newFolderBtn: '#new-folder-btn',
@@ -57,7 +60,7 @@ const newFileHandlers = [
       extension: 'txt'
     },
     routes,
-    menuTitle: () => 'New plain text file...'
+    menuTitle: () => 'Plain text file'
   },
   {
     ext: 'md',
@@ -67,7 +70,7 @@ const newFileHandlers = [
       extension: 'md'
     },
     routes,
-    menuTitle: () => 'New mark-down file...'
+    menuTitle: () => 'Mark-down file'
   },
   {
     ext: 'drawio',
@@ -78,7 +81,7 @@ const newFileHandlers = [
       extension: 'drawio'
     },
     routes,
-    menuTitle: () => 'New draw.io document...'
+    menuTitle: () => 'Draw.io document'
   }
 ]
 
@@ -126,26 +129,26 @@ describe('AppBar component', () => {
         wrapper = getShallowWrapper(route, store)
       })
 
-      it('should show "New" button', () => {
-        const newButton = wrapper.find(elSelector.newFileButton)
+      it('should only show "New" and "Upload" button', () => {
+        const newFolderBtn = wrapper.find(elSelector.newFolderBtn)
         const sizeInfo = wrapper.find(elSelector.sizeInfo)
+        const newFileButton = wrapper.find(elSelector.newFileButton)
+        const uploadButton = wrapper.find(elSelector.uploadButton)
 
         expect(sizeInfo.exists()).toBeFalsy()
-        expect(newButton.isVisible()).toBeTruthy()
-        expect(newButton.props('ariaLabel')).toEqual('Add files or folders')
+        expect(newFileButton.exists()).toBeFalsy()
+        expect(uploadButton.exists()).toBeTruthy()
+        expect(newFolderBtn.isVisible()).toBeTruthy()
+        expect(newFolderBtn.props('ariaLabel')).toEqual('Create a new folder')
       })
       it('should show default file menu items', () => {
-        const ocDrop = wrapper.find(elSelector.ocDrop)
         const fileUpload = wrapper.find(elSelector.fileUpload)
         const folderUpload = wrapper.find(elSelector.folderUpload)
         const newFolderBtn = wrapper.find(elSelector.newFolderBtn)
-        const fileMenuList = wrapper.findAll(elSelector.fileMenuList)
 
-        expect(ocDrop.isVisible()).toBeTruthy()
         expect(fileUpload.isVisible()).toBeTruthy()
         expect(folderUpload.isVisible()).toBeTruthy()
         expect(newFolderBtn.isVisible()).toBeTruthy()
-        expect(fileMenuList.length).toBe(3)
       })
       it('should trigger "showCreateResourceModal" if new-folder button is clicked', async () => {
         const store = createStore({ currentFolder, selected: [] })
@@ -162,12 +165,12 @@ describe('AppBar component', () => {
         const newTextFileBtn = wrapper.find(elSelector.newTextFileBtn)
         const newMdFileBtn = wrapper.find(elSelector.newMdFileBtn)
         const newDrawioFileBtn = wrapper.find(elSelector.newDrawioFileBtn)
-        const fileMenuList = wrapper.findAll(elSelector.fileMenuList)
+        const newFileMenuList = wrapper.findAll(elSelector.newFileMenuList)
 
         expect(newTextFileBtn.isVisible()).toBeTruthy()
         expect(newMdFileBtn.isVisible()).toBeTruthy()
         expect(newDrawioFileBtn.isVisible()).toBeTruthy()
-        expect(fileMenuList.length).toBe(6)
+        expect(newFileMenuList.length).toBe(4)
       })
       it.each(newFileHandlers)(
         'should trigger "showCreateResourceModal" if new file button is clicked',
@@ -193,7 +196,7 @@ describe('AppBar component', () => {
         const store = createStore({ currentFolder, selected: selectedFiles })
         const wrapper = getShallowWrapper(route, store)
         const newButton = wrapper.find(elSelector.newFileButton)
-        const ocDrop = wrapper.find(elSelector.ocDrop)
+        const ocDrop = wrapper.find(elSelector.newFileDrop)
         const sizeInfo = wrapper.find(elSelector.sizeInfo)
 
         expect(newButton.exists()).toBeFalsy()
@@ -221,7 +224,7 @@ describe('AppBar component', () => {
 
     it('should not show "New" button and file menu list', () => {
       const newButton = wrapper.find(elSelector.newFileButton)
-      const ocDrop = wrapper.find(elSelector.ocDrop)
+      const ocDrop = wrapper.find(elSelector.newFileDrop)
 
       expect(newButton.exists()).toBeFalsy()
       expect(ocDrop.exists()).toBeFalsy()
@@ -272,7 +275,7 @@ describe('AppBar component', () => {
       describe('when no items are selected', () => {
         it('should not show "New" button and file menu list', () => {
           const newButton = wrapper.find(elSelector.newFileButton)
-          const ocDrop = wrapper.find(elSelector.ocDrop)
+          const ocDrop = wrapper.find(elSelector.newFileDrop)
 
           expect(newButton.exists()).toBeFalsy()
           expect(ocDrop.exists()).toBeFalsy()
diff --git a/packages/web-app-files/tests/unit/components/AppBar/Upload/FolderUpload.spec.js b/packages/web-app-files/tests/unit/components/AppBar/Upload/FolderUpload.spec.js
index 0cbb4e2098c..37da0e08832 100644
--- a/packages/web-app-files/tests/unit/components/AppBar/Upload/FolderUpload.spec.js
+++ b/packages/web-app-files/tests/unit/components/AppBar/Upload/FolderUpload.spec.js
@@ -44,6 +44,7 @@ describe('FolderUpload Component', () => {
           ...mountOptions,
           stubs: {
             'oc-icon': true,
+            'oc-resource-icon': true,
             'oc-button': true
           }
         })
diff --git a/packages/web-app-markdown-editor/src/index.js b/packages/web-app-markdown-editor/src/index.js
index eb7e30114d4..f5f03597983 100644
--- a/packages/web-app-markdown-editor/src/index.js
+++ b/packages/web-app-markdown-editor/src/index.js
@@ -26,7 +26,7 @@ const appInfo = {
       extension: 'txt',
       newFileMenu: {
         menuTitle($gettext) {
-          return $gettext('New plain text file…')
+          return $gettext('Plain text file')
         }
       },
       ...fileExtensionConfig
@@ -35,7 +35,7 @@ const appInfo = {
       extension: 'md',
       newFileMenu: {
         menuTitle($gettext) {
-          return $gettext('New mark-down file…')
+          return $gettext('Markdown file')
         }
       },
       ...fileExtensionConfig
diff --git a/tests/acceptance/pageObjects/personalPage.js b/tests/acceptance/pageObjects/personalPage.js
index c564f287674..72a0eca6f5d 100644
--- a/tests/acceptance/pageObjects/personalPage.js
+++ b/tests/acceptance/pageObjects/personalPage.js
@@ -125,8 +125,8 @@ module.exports = {
       return this
     },
     selectFileForUpload: function (filePath) {
-      return this.waitForElementVisible('@newFileMenuButton')
-        .click('@newFileMenuButton')
+      return this.waitForElementVisible('@uploadFilesButton')
+        .click('@uploadFilesButton')
         .waitForElementVisible('@fileUploadButton')
         .setValue('@fileUploadInput', filePath)
     },
@@ -314,6 +314,9 @@ module.exports = {
     searchInput: {
       selector: 'input.oc-search-input'
     },
+    uploadFilesButton: {
+      selector: '#upload-menu-btn'
+    },
     newFileMenuButtonAnyState: {
       selector: '#new-file-menu-btn'
     },
diff --git a/tests/e2e/support/page/files/allFiles.ts b/tests/e2e/support/page/files/allFiles.ts
index 343788e69ac..4371b163ded 100644
--- a/tests/e2e/support/page/files/allFiles.ts
+++ b/tests/e2e/support/page/files/allFiles.ts
@@ -64,7 +64,7 @@ export class AllFilesPage {
       await filesCta.navigateToFolder({ page: page, path: folder })
     }
 
-    await page.locator('#new-file-menu-btn').click()
+    await page.locator('#upload-menu-btn').click()
     await page.locator('#fileUploadInput').setInputFiles(files.map((file) => file.path))
 
     if (newVersion) {