Skip to content

Instantly share code, notes, and snippets.

Show Gist options
  • Star 2 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save danawoodman/4788404bc620d5392d111dba98c73873 to your computer and use it in GitHub Desktop.
Save danawoodman/4788404bc620d5392d111dba98c73873 to your computer and use it in GitHub Desktop.
How to allow the file picker AND camera capture on Android

Allow photo album AND the camera

On Android devices, if you want to create a file input that prompts the user to either choose an image from their photo album or take a picture with their camera, you'll need this basically undocumented capture attribute added to your input's accept property:

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

On iOS, the operating system will always show an image picker and the camera with a type="file" input even if it doesn't have the ;capture=camera directive.

Also note, this attribute only does anything on mobile operating systems, this won't change the behavior of your inputs for desktop clients.

The capture property

A final note: if you add a capture property to a file input, like this:

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

...this tells the browser to prefer camera capture over an image picker. The values can be "environment" or "user".

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment