HTML media capture
The capture attribute specifies that, optionally, a new file should be captured, and which device should be used to capture that new media of a type defined by the accept attribute.
Values include user and environment. The capture attribute is supported on the file input type.
The capture attribute takes as its value a string that specifies which camera to use for capture of image or video data, if the accept attribute indicates that the input should be of one of those types.
Value Description
user The user-facing camera and/or microphone should be used.
environment The outward-facing camera and/or microphone should be used
Note: Capture was previously a Boolean attribute which, if present, requested that the device's media capture device(s) such as camera or microphone be used instead of requesting a file input.
Browser support
| Feature | Desktop | Mobile | ||||
|---|---|---|---|---|---|---|
| Chrome | Edge | Firefox | Safari | Chrome Android | Safari iOS | |
| | | | | 25 | 10 | |
| HTML attribute | ||||||
| The capture attribute specifies that, optionally, a new file should be captured, and which device should be used to capture that new media of a type defined by the accept attribute. | | | | | 25 | 10 |
Syntax
<!-- Camera activation --> <input type="file" accept="image/*" capture="environment"> <!-- Front camera --> <input type="file" accept="image/*" capture="user"> <!-- Microphone activation --> <input type="file" accept="audio/*" capture>Use cases
-
Improve form input
Use HTML media capture to make data entry more efficient, guided, or predictable inside real forms.
-
Reduce friction
Apply HTML media capture when the browser can help users complete a task with fewer mistakes or less repetitive work.
Cautions
- Test HTML media capture in your target browsers and input environments before depending on it as a primary behavior.
- Provide a fallback path or acceptable degradation strategy when support is still limited.
Accessibility
- Keep labels, instructions, validation, and keyboard behavior clear so the enhancement helps rather than surprises users.