# Bootstrap 5 File upload

Bootstrap 5 file upload input examples for AdminKit: default, small and large sizes, disabled, readonly and multiple-file fields with plain HTML.

## Example

```html
<div class="mb-3">
  <label for="formFile" class="form-label">Default file input example</label>
  <input class="form-control" type="file" id="formFile">
</div>
```

## Sizes

Set heights using classes like `.form-control-lg` and `.form-control-sm.`

```html
<div class="mb-3">
  <label for="formFileSm" class="form-label">Small file input example</label>
  <input class="form-control form-control-sm" id="formFileSm" type="file">
</div>
<div class="mb-3">
  <label for="formFileSm" class="form-label">Default file input example</label>
  <input class="form-control" id="formFileMd" type="file">
</div>
<div>
  <label for="formFileLg" class="form-label">Large file input example</label>
  <input class="form-control form-control-lg" id="formFileLg" type="file">
</div>
```

## Disabled

Add the `disabled` boolean attribute on an file input to give it a grayed out appearance and remove pointer events.

```html
<div class="mb-3">
  <label for="formFileDisabled" class="form-label">Disabled file input example</label>
  <input class="form-control" type="file" id="formFileDisabled" disabled>
</div>
```

## Readonly

Add the `readonly` boolean attribute on an file input to prevent modification of the input’s value. Read-only inputs appear lighter (just like disabled inputs), but retain the standard cursor.

```html
<div class="mb-3">
  <label for="formFileReadonly" class="form-label">Readonly file input example</label>
  <input class="form-control" type="file" id="formFileReadonly" readonly>
</div>
```

## Multiple files

Add the `multiple` boolean attribute on an file input to enable multi-file selection.

```html
<div class="mb-3">
  <label for="formFileMultiple" class="form-label">Multiple files input example</label>
  <input class="form-control" type="file" id="formFileMultiple" multiple>
</div>
```

---

Canonical HTML page: https://adminkit.io/bootstrap/docs/forms/file-upload/

Site overview for agents: https://adminkit.io/llms.txt (expanded: https://adminkit.io/llms-full.txt) · Documentation: https://adminkit.io/bootstrap/docs/ · Questions: support@adminkit.io