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

Use hand-tracking-controls to integrate hand tracked input in your application. The component provides a visual representation of the hand and basic gesture recognition. It can be used along tracked controllers (e.g: oculus-touch-controls) for applications requiring multiple input methods. Component is only active when the browser and underlying system starts tracking the user’s hands.


<a-entity id="leftHand" hand-tracking-controls="hand: left;"></a-entity>
<a-entity id="rightHand" hand-tracking-controls="hand: right;"></a-entity>


Property Description Default Value
hand The hand that will be tracked (i.e., right, left). left
modelColor Color of hand material. white
modelStyle Mesh representing the hand or dots matching the joints mesh


Event Name Description
pinchstarted The pinch gesture has started. World coordinates passed as event detail.
pinchended The pinch gesture has ended. World coordinates passed as event detail.
pinchmoved The hand moved while making the pinch gesture. Useful for interactions that track the hand while the gesture is engaged. World coordinates passed as event detail.