WebAR SDK for Browser Face Tracking and AR Effects
Banuba's Web AR SDK is a JavaScript library that runs real-time face tracking, virtual try-on and AR effects directly in the browser, with no app to install. It uses the same on-device engine as the Banuba Face AR SDK, runs at a minimum of 30 FPS, and keeps camera frames on the user's device.
Selected by Hundreds of Leading Brands
Try Banuba Web AR SDK live
Create Web AR Effects in Banuba Studio
-
Build your own face filters, touch-up, AR makeup, backgrounds, foregrounds and 3D masks in Banuba Studio, then load them into the Web AR SDK.
-
Import .gltf models and convert them into effects compatible with Banuba SDKs.
-
Work in the browser from anywhere, with no downloads required.
-
Use the Studio interface in 5 languages.
-
Follow step-by-step documentation to publish your first effect quickly.
AR SDK for Web: What You Can Build
Banuba's Web AR SDK brings the face tracking that powers native apps into the browser, so one integration drives try-on, beauty filters, backgrounds and other effects on any web page.
Webcam Face Filters
Add animated masks, face filters and 3D effects that follow facial expressions in real time through the user's webcam. The same tracking behind Banuba's face filters SDK for native apps runs here in the browser.
Try-On
Add virtual try-on for glasses, jewelry and hats to any store page, so shoppers see products on their own face before they buy.
Virtual Makeup
Add lipstick, eyeshadow and full makeup looks to help people look their best on camera. And online shoppers can combine and compare cosmetics on their own face before purchase. For a ready-made web app, see TINT makeup virtual try-on.
Hair Color
Add realistic hair color previews so users can test a new shade live on camera, with color that stays on the hair as the person moves.
Background Changer
Web AR Features
-
Face detection and tracking. Tracks several faces at once and applies AR assets to each of them as needed.
-
Hair segmentation. Separates hair from face and background so recoloring covers every strand and nothing else.
-
Lips segmentation. Renders lipstick textures precisely, as well as lets users change the lip size and shape.
-
Background segmentation. Blurs, replaces or animates everything behind the user.
-
Browser support. Runs in any browser with WebGL 2.0 or higher, including Chrome, Firefox and Safari, on desktop, Android, and iOS.
Web AR Platform Use Cases by Industry
Build browser-based AR experiences for any field. Overlay 3D objects, face masks or beauty effects that users open from a link.
-
Education
Turn lessons into interactive AR experiences that students open in the browser, with no app to install on school devices.
-
Video Conferencing
Add face filters, touch-up and background replacement to browser-based meeting and social calling apps.
-
Live Streaming
Add face filters, background effects and beautification to web-based live streams, including streams built on Agora.
-
Games
Build browser games where AR effects react to players' faces and encourage social play.
-
E-Commerce
Add virtual try-on to your online store with a few lines of JavaScript to drive product discovery and sales.
-
Advertising
Launch campaigns as no-app WebAR experiences that people open from a single link.
-
Photo Booth
Build interactive photo booths with real-time webcam AR and photo capture.
-
Photo & Video Editors
Add beautification, filters and background effects to web photo and video editors, applied in one click.
Why Choose Banuba's Web AR SDK
-
No app install. Users start from a web link, with no app store step between your project and the camera.
-
On-device processing. Camera frames are processed in the user's browser and are never sent to a server.
-
One codebase for mobile and desktop web. The same integration serves iOS, Android and desktop browsers instead of separate builds per platform.
-
Same engine as native. Built on the face tracking of the Banuba Face AR SDK, so web and mobile products can share effects created in Banuba Studio.
-
Fast JavaScript integration. Install the package and follow the Web AR SDK documentation to get a first effect running.
-
Ready-made asset catalog. Launch with existing WebAR assets, then add custom effects as you grow.
-
Web standards compatible. Works alongside HTML and WebGL content in both 2D and 3D.
-
Banuba's Web AR SDK runs face tracking and AR effects directly in Chrome, Safari, Firefox and other WebGL 2.0 browsers, with no app to install. Users allow webcam access on your page and the effects start running on their device. It is the browser version of the Banuba Face AR SDK, using the same on-device tracking.
-
Banuba's Web AR SDK runs in any browser with WebGL 2.0 or higher on desktop, iOS and Android, so a single web integration covers all three. For native apps, the same face tracking is available in Banuba's Face AR SDK. Browser requirements are listed in the Web AR SDK documentation.
-
Yes, Banuba's Web AR SDK processes live camera video in real time at an average of 30 FPS in the browser, and it can also apply effects to still photos. All processing runs on the user's device, using the same tracking as the Banuba face filters SDK.
-
Banuba prices the Web AR SDK by usage rather than a flat license, based on the number of your monthly active users (MAU). Because the price follows MAU, a pilot or small deployment is quoted on its actual usage, as explained in the Banuba Face AR SDK pricing guide.
-
Yes, Banuba offers a 14-day free trial of the Web AR SDK, and no credit card is required. Request your trial token through the Web AR SDK free trial form.
-
Yes, Banuba's Web AR SDK adds virtual try-on to stores built on Magento, Shopify, BigCommerce, WooCommerce or a custom stack, using JavaScript on the product page. See how Banuba's web-based virtual try-on works for retail.
-
Yes, Banuba's Web AR SDK integrates with Agora, so you can apply face filters, beautification and background effects to Agora video calls and live streams in the browser. Banuba maintains a working Agora web video call sample on GitHub.
-
Start by requesting a Banuba trial token, then clone the Web AR quickstart and run it locally with your token. The Banuba Web AR quickstart shows camera setup, effect loading and rendering in a minimal project.
-
Banuba's official Web AR SDK documentation lives on docs.banuba.com and covers installation, the API reference and effect management. Begin with the Banuba Web AR SDK documentation.
-
Banuba publishes its Web AR SDK code samples on GitHub, with a ready-to-run quickstart project for browser integration. Clone the Banuba quickstart-web repository to see a full working setup.
-
Most teams integrate Banuba's Web AR SDK in days, not months, because it ships as a JavaScript package with a working quickstart. AI coding assistants can speed this up further with the Banuba AI skills repository.
-
Yes, Banuba provides Agent Skills for the Web AR SDK that help AI coding assistants generate integration code grounded in Banuba's documentation. Setup steps are in the Banuba Agent Skills guide.