References

Beginner-friendly references for web development, with live, editable examples.

The HTML capture attribute

Attribute All modern browsers Updated
Quick answer

The HTML capture attribute asks mobile devices to capture media directly from a camera or microphone. It is used on the <input type="file"> element.

Overview

The capture attribute requests media capture from a device camera/mic. It is used on form controls such as <input>, <select> and <textarea>.

It is a form-control attribute: it configures how a control behaves, what it accepts, or its initial value, working alongside the control's <label> and parent <form>. Constraint attributes also feed the browser's built-in validation.

Syntax

<input type="file" accept="image/*" capture="environment">

Values

Value
user (front camera) | environment (rear camera)

Best practices

  • Give every control a <label> so it has an accessible name.
  • Treat client-side constraints as a convenience — always validate again on the server, since they can be bypassed.
  • Choose the most specific input type so users get the right on-screen keyboard and built-in checks.
  • Keep the submitted name and value meaningful for whatever processes the form.

Frequently asked questions

What does the capture attribute do?
Requests media capture from a device camera/mic.
Are HTML form attributes enough for validation?
They give instant feedback, but client-side checks can be bypassed, so always validate on the server too.
Do form controls still need a label?
Yes. Every control needs a <label> for an accessible name, whatever attributes you set.
Which elements use the capture attribute?
It is an element-specific attribute, used on form controls such as <input>, <select> and <textarea>.