Note: This documentation is for the old 1.0.0 version of A-Frame. Check out the documentation for the current 1.3.0 version

Starting with Safari on iOS 13 browsers require sites to be served over https and request user permission to access DeviceOrientation events. This component presents a permission dialog for the user to grant or deny access. The device-orientation-permission-ui component applies only to the <a-scene> element

To configure the style of the dialog one can redefine the associated css styles. To change the colors of the allow, deny and ok buttons:

.a-dialog-allow-button {
background-color: red;

.a-dialog-deny-button {
background-color: blue;

.a-dialog-ok-button {
background-color: green;


<a-scene device-orientation-permission-ui="enabled: false"></a-scene>


Property Description Default Value
enabled Whether or not to display the dialog when required true


Event Name Description
deviceorientationpermissiongranted User has granted access to DeviceOrientation events
deviceorientationpermissionrejected User or browser has denied access to DeviceOrientation events
deviceorientationpermissionrequested Application has requested permission to access DeviceOrientation events