Device Orientation Viewer

Fast, accurate and free online device orientation viewer tool running directly in your browser.

Secure (SSL)

Client-Side Processing

100% Free

Go to tool

Instructions

1

Enter data
Enter content, paste text or load a file from disk.
2

Click the button
The tool will immediately process your data in the browser.
3

Get the result
Copy the finished text or save the file to your device.

                                                function runTool() {

                                                  return "Result ready in 0.1s";

                                                }

Settings

Units

Projection

Input data

4 characters

Smoothing

Cube size

Bg grid Tool Option

Show axes Tool Option

Invert x Tool Option

Invert y Tool Option

Invert z Tool Option

Result

initialized: 1

Rate this tool:

Related tools

Other tools you may find useful

Device orientation preview - gyroscope data in the browser

DeviceOrientationEvent and DeviceMotionEvent are browser APIs that enable reading data from the gyroscope, accelerometer and magnetometer of a mobile device. The tool displays the current values of alpha (Z rotation), beta (front/back), gamma (left/right) and acceleration - without installation, straight from the browser.

device orientation DeviceOrientationEvent gyroscope in the browser mobile accelerometer

Orientation angles - alpha, beta, gamma

alpha (0-360°): rotation around the Z axis (magnetic compass - deviation from North). beta (-180° to 180°): front/back tilt (screen horizontal = 0°, vertically held = 90°). gamma (-90° to 90°): left/right tilt. Together they form an Eulerian system to describe the position of the device in space.

DeviceMotionEvent – acceleration

accelerationIncludingGravity: acceleration with gravity (m/s²) for x, y, z axes. acceleration: acceleration without gravity (requires gyro sensor). rotationRate: rotation rate (°/s) for alpha, beta, gamma. interval: sampling rate in ms (typically 16ms = 60Hz on modern devices).

Applications in web applications

Mobile games (tilt controls). PWA with compass (alpha + magnetometer). Tilt-responsive animations (3D parallax). Step counter (accelerometer + step detection algorithm). Bubble level (beta + gamma). Shake gestures.

Permissions and iOS

iOS 13+: DeviceOrientationEvent requires explicit requestPermission() after user interaction. Android Chrome: Works by default. iOS Safari: requestPermission() must be called in an event handler (e.g. onclick). The tool includes an "Allow Access" button for iOS.

FAQ

Why isn't my data working on my desktop?

Desktop has no gyroscope or accelerometer. DeviceOrientationEvent on PC returns null or solid zeros. The tool displays a message about the lack of a sensor. For testing: Chrome DevTools → Sensors → Device Orientation (simulation).

How to simulate orientation in Chrome?

Chrome DevTools (F12) → Sensors (three dots or Escape in the menu) → Device Orientation: you can manually set alpha/beta/gamma values or select predefined poses (portrait, landscape, upside down).

What is the accuracy of the gyroscope in smartphones?

Budget phones: ±2-5°. Flagship: ±0.5-1°. Drift (drift) increases over time - calibration by a figure-eight movement. For precise applications (VR, AR), a fusion sensor with an accelerometer and magnetometer (Madgwick filter) is recommended.

Can I use orientation for WebXR (AR/VR)?

Yes – WebXR API (immersive-ar, immersive-vr) uses sensor data. DeviceOrientation is an older, simpler alternative to 2D orientation without full XR. For PWA without WebXR, the DeviceOrientation headset is standard.

How to protect the application against missing sensor?

if (window.DeviceOrientationEvent) { DeviceOrientationEvent.requestPermission().then(...) } else { showFallback(); }. Feature detection + graceful degradation: show an alternative interface when the sensor is unavailable.

Related tools: Web Bluetooth tester, CSS feature detector and JSON Schema validator.