Introduction
Build browser-based face detection and hand tracking features with MediaPipe Tasks Vision and Next.js.
Welcome to Krave Docs — practical guides and customizable components for adding computer vision to web applications.
Krave focuses on two browser-based capabilities powered by MediaPipe Tasks Vision: detecting faces in a camera stream and tracking hand landmarks in real time. The examples are built for Next.js and show how to integrate these features into a React application.
Explore the guides
Each component guide includes a shadcn CLI installation command, a usage example, and the component source so you can understand and adapt the implementation to your project.
- Face detection identifies faces in the camera feed and draws a detection box with a confidence label.
- Hand landmark tracking detects hands and visualizes their landmark connections.
The live demos ask for camera access only when you choose to start them. You can browse the guides and their code without starting a camera demo.
Get started
If this is your first Krave component, begin with the installation guide to prepare your project and add a component. Then follow the relevant guide to integrate and customize it.