--- id: Simple file upload section: components subsection: file-upload cssPrefix: pf-v5-c-file-upload ---## Examples ### Basic file upload ```html
``` ### Upload complete non editable ```html
``` ### Upload complete editable ```html
``` ### Drag file hover component ```html
``` ### File upload in form with error ```html
We don't support this file type. Try again with a different file type.
``` ### File upload loading ```html
``` ## Documentation ### Overview ### Usage | Class | Applied to | Outcome | | -- | -- | -- | | `.pf-v5-c-file-upload` | `
`, `
` | Initiates the file upload component. **Required**. | | `.pf-v5-c-file-upload__file-select` | `
` | Initiates the file select element. **Required** | | `.pf-v5-c-file-upload__file-details` | `
` | Initiates the file details element. **Required** | | `.pf-v5-c-file-upload__file-details-spinner` | `
` | Initiates the file details element. **Required** | | `.pf-m-drag-hover` | `.pf-v5-c-file-upload` | Modifies file upload for when an element is dragged or dropped inside of its container. | | `.pf-m-loading` | `.pf-v5-c-file-upload` | Modifies file upload for the loading state. |