Brewser.js is a simple open source device and browser detection library. This page demonstrates how the API* gives you access to fairly accurate** device info and browser capabilities.
Let's see what brewser.js has found for you:
BREWSER.ua
BREWSER
| screenWidth | |
| screenHeight | |
| windowWidth | |
| windowHeight | |
| resolution |
BREWSER.device
| os | |
| touch | |
| phone | |
| tablet | |
| desktop | |
| orientation.portrait | |
| orientation.landscape |
BREWSER.browser
| type | |
| version | |
| fullVersion | |
| string | |
| chrome | |
| safari | |
| opera | |
| firefox | |
| ie | |
| edge | |
| kindle | |
| other | |
| mobile |
BREWSER.has
| canvas | |
| webGL | |
| rAF | |
| cssTransform | |
| mediaQueries | |
| getUserMedia | |
| audio tag | |
| audio API | |
| audioFormats.mp3 | |
| audioFormats.mp4 | |
| audioFormats.wav | |
| audioFormats.ogg | |
| web audio API | |
| video tag | |
| videoFormats.mp4 | |
| videoFormats.webm | |
| videoFormats.ogg |
*API notes
Using the API is pretty straightforward - simply use the syntax shown in the tables above.
The API groups test results for better accessibility:
- BREWSER.has stores all browser capability results;
- BREWSER.device has all device related info;
- BREWSER.browser groups all browser tests.
A few quick examples:
- BREWSER.UA gives you the User Agent String;
- BREWSER.ua gives you the lowercased User Agent String;
- BREWSER.resolution returns window.devicePixelRatio
- BREWSER.browser.chrome tells you if you're on Chrome;
- BREWSER.device.phone tells you if the device is a phone;
- BREWSER.has.webGL returns true if the browser supports 3D canvas.
Examples of combining simple tests:
- BREWSER.device.desktop && BREWSER.device.touch detects laptops with touch support;
- !BREWSER.device.desktop && BREWSER.device.orientation.portrait to see if the phone/tablet is in portrait mode;
You can also access BREWSER via br on window, so that it's less typing for you.
**A quick note on accuracy
Browser capability detection is pretty simple, but as you probably know device detection is a bit of a pain. brewser.js sniffs the User Agent string to detect certain device types and operating systems. That is to give you as much useful information as possible to distinguish between key device and OS types. As we know this can be tricky and inaccurate in some cases.
