It's 2020, and browsers can do amazing stuff.

This article contains a non-exhaustive list of less-known features implemented in browsers today.

This list isn't intended for a technical audience; instead, it wants to be a "I didn't know we could do that in a browser!" list.

In many cases, listed features aren't yet part of the standard, and may only be available on certain browsers or configurations.

prefers-color-scheme

Many operating systems provide light or dark color theme (notably dark mode on macOS). Websites can detect the preferred color scheme.

prefers-reduced-motion

Similarly to dark mode, users in their OS can remove/reduce animations, and we can also detect that.

Payment Request API

You can process payments delegating the browser. If configured, the UI will be autofilled with your credit card, shipping info and whatnot.

Delegate the share of URLs or files to the OS, providing share options based on the installed apps and user preference.

Push API

Browsers can register push notifications. Sent either immediately or later, these notifications can contain images, buttons and inline replies.

Service Workers

Among other features, service workers can enable offline browsing and background tasking.

Example:

Provide a fallback when internet isn't available
Sending a form when internet isn't available will result in data lost. A service worker can be used to save that data and send it later when an internet connection is up again

Web/native app install banners

Display a native banner to encourage users to add the app/website to home or to install a native app.

Check if the native app related to your site is already installed.

Picture-in-Picture (PiP)

Consent to play a video and detach it from the current page, staying sticky and always visible.

Media Session API

Customize media notifications by providing metadata and actions.

Chrome Sender API

If Chromecast is available, you can stream a video/audio to your TV/Chromecast-enabled device.

AirPlay

Consent to stream a media over AirPlay (like AppleTV).

Force Touch API

With some Apple-specific hardware (like iPhone6S+ and Magic Trackpad) you can detect force pressure.

AR Quick Look

On iOS you can display a .usdz 3D asset using a native AR UI.

WebUSB API

Allows you to access and use peripherals connected via USB.

Web Bluetooth API

Allows you to access and use bluetooth devices.

Web Locks API

Prevent display sleep and enable wake lock.

Keyboard Lock

While in fullscreen, allows to receive keys that are normally handled by the system or the browser like Cmd/Alt-Tab, or Esc.

Generic Sensor API

Allows you to use several sensors like Accelerometer, Gyroscope, AmbientLightSensor, Magnetometer

Credential Management API

Enables you to store and retrieve password credentials. It also enables tap-to-sign-in and automatic sign back, password sharing on multiple devices, and many more.

Clipboard API

Allows you to read and write text and images into the OS clipboard buffer.

Presentation API

Gives you the ability to access external presentation-type displays and use them for presenting web content.

getUserMedia camera selection

When using camera/microphone, we can select the input source (example front or back camera). On the Pixel 4XL we can even access the infrared camera (used for face detection).

Gives access to raw mouse movement, locks the target of mouse events to a single element, eliminates limits of how far mouse movement can go in a single direction, and removes the cursor from view. Obvious use cases are for first person or real time strategy games.

This list was originally published in this GitHub repo and has been lightly edited for clarity.

Stuff under Origin Trial

Free Quote:

Estimate cost and timeline for your custom app