--- description: Unofficial Capacitor plugin for Google ML Kit Face Mesh Detection SDK to detect faces and their mesh in images. title: Capacitor ML Kit Face Mesh Detection Plugin for Android - Capawesome image: https://capawesome.io/docs/assets/images/social/plugins/mlkit/face-mesh-detection.png --- [ Skip to content](#capacitor-mlkitface-mesh-detection) [ 🎉 Introducing **Capawesome Platform** — one platform for Live Updates, Native Builds, App Store Publishing, and Insider SDKs.](https://capawesome.io) * [ Formbricks ](/docs/plugins/formbricks/) * [ Geocoder ](/docs/plugins/geocoder/) * [ Google Sign-In ](/docs/plugins/google-sign-in/) * [ libSQL ](/docs/plugins/libsql/) * [ Live Update ](/docs/plugins/live-update/) * [ Managed Configurations ](/docs/plugins/managed-configurations/) * [ Media Session ](/docs/plugins/media-session/) * [ ML Kit ](/docs/plugins/mlkit/) * [ Configuration ](#configuration) * [ Demo ](#demo) * [ Usage ](#usage) * [ API ](#api) * [ Enums ](#enums) * [ Terms & Privacy ](#terms-privacy) * [ Changelog ](#changelog) * [ License ](#license) * [ Selfie Segmentation ](/docs/plugins/mlkit/selfie-segmentation/) * [ Subject Segmentation ](/docs/plugins/mlkit/subject-segmentation/) * [ Translation ](/docs/plugins/mlkit/translation/) * [ NFC ](/docs/plugins/nfc/) * [ OAuth ](/docs/plugins/oauth/) * [ Pedometer ](/docs/plugins/pedometer/) * [ Photo Editor ](/docs/plugins/photo-editor/) * [ PostHog ](/docs/plugins/posthog/) * [ Printer ](/docs/plugins/printer/) * [ Purchases ](/docs/plugins/purchases/) * [ RealtimeKit ](/docs/plugins/realtimekit/) * [ Screen Orientation ](/docs/plugins/screen-orientation/) * [ Screenshot ](/docs/plugins/screenshot/) * [ Secure Preferences ](/docs/plugins/secure-preferences/) * [ Speech Recognition ](/docs/plugins/speech-recognition/) * [ Speech Synthesis ](/docs/plugins/speech-synthesis/) * [ Share Target ](/docs/plugins/share-target/) * [ Square Mobile Payments ](/docs/plugins/square-mobile-payments/) * [ SQLite ](/docs/plugins/sqlite/) * [ Superwall ](/docs/plugins/superwall/) * [ Torch ](/docs/plugins/torch/) * [ Wifi ](/docs/plugins/wifi/) * [ Zip ](/docs/plugins/zip/) * [ Cloud ](/docs/cloud/) * [ Live Updates ](/docs/cloud/live-updates/) * Advanced * Integrations * [ Native Builds ](/docs/cloud/native-builds/) * [ Configuration ](/docs/cloud/native-builds/configuration/) * [ Environments ](/docs/cloud/native-builds/environments/) * Guides * [ Sample Projects ](/docs/cloud/native-builds/sample-projects/) * [ Troubleshooting ](/docs/cloud/native-builds/troubleshooting/) * [ Automations ](/docs/cloud/automations/) * [ Assist ](/docs/cloud/assist/) * Account * Organizations * [ Organization and User Management ](/docs/cloud/organizations/memberships/) * [ Single Sign-On (SSO) ](/docs/cloud/organizations/sso/) * [ Teams ](/docs/cloud/organizations/teams/) * [ Two-Factor Authentication ](/docs/cloud/organizations/two-factor-authentication/) * [ Integrations ](/docs/cloud/integrations/) * [ License Keys ](/docs/cloud/license-keys/) * [ Webhooks ](/docs/cloud/webhooks/) * [ Pricing ](https://capawesome.io/pricing/) * [ FAQ ](/docs/cloud/faq/) * [ Support ](/docs/cloud/support/) * [ Contributing ](/docs/contributing/) * [ LLMs ](/docs/llms/) * [ Insiders ](/docs/insiders/) * [ License ](https://capawesome.io/legal/eula/) * [ Support ](/docs/insiders/support/) * [ FAQ ](/docs/insiders/faq/) * [ Blog ](/blog/) * Categories * [ Configuration ](#configuration) * [ Demo ](#demo) * [ Usage ](#usage) * [ API ](#api) * [ Enums ](#enums) * [ Terms & Privacy ](#terms-privacy) * [ Changelog ](#changelog) * [ License ](#license) # @capacitor-mlkit/face-mesh-detection[¶](#capacitor-mlkitface-mesh-detection "Permanent link") Unofficial Capacitor plugin for [ML Kit Face Mesh Detection](https://developers.google.com/ml-kit/vision/face-mesh-detection).[1](#fn:1) [ ![Deliver Live Updates to your Capacitor app with Capawesome Cloud](../../../assets/external/cloud.capawesome.io/assets/banners/cloud-build-and-deploy-capacitor-apps.69628c3f.png) ](https://cloud.capawesome.io/) ## Newsletter[¶](#newsletter "Permanent link") Stay up to date with the latest news and updates about the Capawesome, Capacitor, and Ionic ecosystem by subscribing to our [Capawesome Newsletter](https://cloud.capawesome.io/newsletter/). ## Compatibility[¶](#compatibility "Permanent link") | Plugin Version | Capacitor Version | Status | | -------------- | ----------------- | -------------- | | 8.x.x | \>=8.x.x | Active support | | 6.x.x | 6.x.x | Deprecated | ## Installation[¶](#installation "Permanent link") You can use our **AI-Assisted Setup** to install the plugin. Add the [Capawesome Skills](https://github.com/capawesome-team/skills) to your AI tool using the following command: `[](#%5F%5Fcodelineno-0-1)npx skills add capawesome-team/skills --skill capacitor-plugins ` Then use the following prompt: `` [](#%5F%5Fcodelineno-1-1)Use the `capacitor-plugins` skill from `capawesome-team/skills` to install the `@capacitor-mlkit/face-mesh-detection` plugin in my project. `` If you prefer **Manual Setup**, install the plugin by running the following commands and follow the platform-specific instructions below: `[](#%5F%5Fcodelineno-2-1)npm install @capacitor-mlkit/face-mesh-detection [](#%5F%5Fcodelineno-2-2)npx cap sync ` ### Android[¶](#android "Permanent link") #### Variables[¶](#variables "Permanent link") If needed, you can define the following project variable in your app’s `variables.gradle` file to change the default version of the dependency: * `$mlkitFaceMeshDetectionVersion` version of `com.google.mlkit:face-mesh-detection` (default: `16.0.0-beta1`) This can be useful if you encounter dependency conflicts with other plugins in your project. ## Configuration[¶](#configuration "Permanent link") No configuration required for this plugin. ## Demo[¶](#demo "Permanent link") A working example can be found here: [robingenz/capacitor-mlkit-plugin-demo](https://github.com/robingenz/capacitor-mlkit-plugin-demo) ## Usage[¶](#usage "Permanent link") `[](#%5F%5Fcodelineno-3-1)import { FaceMeshDetection, UseCase } from '@capacitor-mlkit/face-mesh-detection'; [](#%5F%5Fcodelineno-3-2) [](#%5F%5Fcodelineno-3-3)const processImage = async () => { [](#%5F%5Fcodelineno-3-4) const { faceMeshs } = await FaceMeshDetection.processImage({ [](#%5F%5Fcodelineno-3-5) path: 'path/to/image.jpg', [](#%5F%5Fcodelineno-3-6) useCase: UseCase.FaceMesh, [](#%5F%5Fcodelineno-3-7) }); [](#%5F%5Fcodelineno-3-8) return faceMeshs; [](#%5F%5Fcodelineno-3-9)}; ` ## API[¶](#api "Permanent link") * [processImage(...)](#processimage) * [Interfaces](#interfaces) * [Enums](#enums) ### processImage(...)[¶](#processimage "Permanent link") `[](#%5F%5Fcodelineno-4-1)processImage(options: ProcessImageOptions) => Promise ` Detects face mesh from the supplied image. Only available on Android. | Param | Type | | ----------- | ------------------------------------------- | | **options** | [ProcessImageOptions](#processimageoptions) | **Returns:** `Promise<[ProcessImageResult](#processimageresult)>` **Since:** 5.3.0 --- ### Interfaces[¶](#interfaces "Permanent link") #### ProcessImageResult[¶](#processimageresult "Permanent link") | Prop | Type | Description | Since | | ------------- | ------------ | ------------------------ | ----- | | **faceMeshs** | FaceMesh\[\] | The detected face meshs. | 5.3.0 | #### FaceMesh[¶](#facemesh "Permanent link") Represents a face mesh detected by `FaceMeshDetector`. When `BoundingBoxOnly` is selected, [FaceMesh](#facemesh) only contains valid bounding box. When [FaceMesh](#facemesh) is selected, [FaceMesh](#facemesh) also contains a group of 468 3D face mesh points and related triangle information. Each point is represented by [FaceMeshPoint](#facemeshpoint) describing a specific position in detected face. The triangle information is a group of 3 `FaceMeshPoint`s representing a valid surface on Face (e.g. a valid small surface on nose tip). | Prop | Type | Description | Since | | ------------------ | --------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----- | | **bounds** | [Rect](#rect) | Returns the axis-aligned bounding rectangle of the detected face mesh. | 5.3.0 | | **contours** | [Contours](#contours) | Returns contours with a list of [FaceMeshPoint](#facemeshpoint) representing the detected face. | 5.3.0 | | **faceMeshPoints** | FaceMeshPoint\[\] | Returns a list of [FaceMeshPoint](#facemeshpoint) representing the whole detected face. | 5.3.0 | | **triangles** | Triangle\[\] | Returns a list of [Triangle](#triangle) representing logical triangle surfaces of detected face. Each [Triangle](#triangle) contains 3 [FaceMeshPoint](#facemeshpoint), representing 3 points of the triangle surface. The sequence of the 3 points are constant and always counter clockwise in face mesh. | 5.3.0 | #### Rect[¶](#rect "Permanent link") [Rect](#rect) holds four integer coordinates for a rectangle. | Prop | Type | Description | Since | | ---------- | ------ | ---------------------------------------------------- | ----- | | **left** | number | The X coordinate of the left side of the rectangle. | 5.3.0 | | **top** | number | The Y coordinate of the top of the rectangle. | 5.3.0 | | **right** | number | The X coordinate of the right side of the rectangle. | 5.3.0 | | **bottom** | number | The Y coordinate of the bottom of the rectangle. | 5.3.0 | #### Contours[¶](#contours "Permanent link") Represents contours with their face mesh points. | Prop | Type | Description | Since | | ---------------------- | ----------------- | ------------------------------------------------------ | ----- | | **faceOval** | FaceMeshPoint\[\] | Returns all points for the FaceOval contour. | 5.3.0 | | **leftEyebrowTop** | FaceMeshPoint\[\] | Returns all points for the LeftEyebrowTop contour. | 5.3.0 | | **leftEyebrowBottom** | FaceMeshPoint\[\] | Returns all points for the LeftEyebrowBottom contour. | 5.3.0 | | **rightEyebrowTop** | FaceMeshPoint\[\] | Returns all points for the RightEyebrowTop contour. | 5.3.0 | | **rightEyebrowBottom** | FaceMeshPoint\[\] | Returns all points for the RightEyebrowBottom contour. | 5.3.0 | | **leftEye** | FaceMeshPoint\[\] | Returns all points for the LeftEye contour. | 5.3.0 | | **rightEye** | FaceMeshPoint\[\] | Returns all points for the RightEye contour. | 5.3.0 | | **upperLipTop** | FaceMeshPoint\[\] | Returns all points for the UpperLipTop contour. | 5.3.0 | | **upperLipBottom** | FaceMeshPoint\[\] | Returns all points for the UpperLipBottom contour. | 5.3.0 | | **lowerLipTop** | FaceMeshPoint\[\] | Returns all points for the LowerLipTop contour. | 5.3.0 | | **lowerLipBottom** | FaceMeshPoint\[\] | Returns all points for the LowerLipBottom contour. | 5.3.0 | | **noseBridge** | FaceMeshPoint\[\] | Returns all points for the NoseBridge contour. | 5.3.0 | #### FaceMeshPoint[¶](#facemeshpoint "Permanent link") Represents a 3D point in face mesh. The index is an unique ID meaning a fixed position on face, ranging from 0 to 467. In [Point3D](#point3d), `x` and `y` are pixel location of detected face in `InputImage`.`z` is also scaled to image size, while the origin will be somewhere in the center of all 468 face mesh points. | Prop | Type | Description | Since | | --------- | ------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----- | | **index** | number | Gets the index of the face mesh point, ranging from 0 to 467\. For each specific point, the index is a constant value. | 5.3.0 | | **point** | [Point3D](#point3d) | Gets a 3D point in face mesh. Inside [Point3D](#point3d), X and Y means a 2D position in original image. More information on the Z value: - The unit of measure for the Z value is the same as X and Y. - The smaller the Z value, the closer that landmark is to the camera. - The Z origin is approximately at the center of all 468 face mesh points. Z value will be negative if the point is close to camera and will be positive if the point is away from the camera. | 5.3.0 | #### Point3D[¶](#point3d "Permanent link") Represents a 3D point. | Prop | Type | Description | Since | | ----- | ------ | --------------------------------- | ----- | | **x** | number | Returns the X value of the point. | 5.3.0 | | **y** | number | Returns the Y value of the point. | 5.3.0 | | **z** | number | Returns the Z value of the point. | 5.3.0 | #### Triangle[¶](#triangle "Permanent link") Represents a triangle with 3 generic points. | Prop | Type | Description | Since | | ---------- | ----------------- | ---------------------------------------------------- | ----- | | **points** | FaceMeshPoint\[\] | Returns all points inside the [Triangle](#triangle). | 5.3.0 | #### ProcessImageOptions[¶](#processimageoptions "Permanent link") | Prop | Type | Description | Default | Since | | ----------- | ------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ---------------- | ----- | | **path** | string | The local path to the image file. | 5.3.0 | | | **useCase** | [UseCase](#usecase) | Sets the use case. When BoundingBoxOnly is selected, the returned [FaceMesh](#facemesh) only contains bounding box. When [FaceMesh](#facemesh) is selected, the returned [FaceMesh](#facemesh) contains bounding box as well as 468 [FaceMeshPoint](#facemeshpoint) and triangle information. It detects at most 2 faces in this case and it is slower than BoundingBoxOnly. | UseCase.FaceMesh | 5.3.0 | ### Enums[¶](#enums "Permanent link") #### UseCase[¶](#usecase "Permanent link") | Members | Value | Description | Since | | ------------------- | ----- | ------------------------------------------------------------------------------------- | ----- | | **BoundingBoxOnly** | 0 | Return bounding box for detected face. | 5.3.0 | | **FaceMesh** | 1 | Return face mesh info for detected face. It detects at most 2 faces in this use case. | 5.3.0 | ## Terms & Privacy[¶](#terms-privacy "Permanent link") This plugin uses the [Google ML Kit](https://developers.google.com/ml-kit): * [Terms & Privacy](https://developers.google.com/ml-kit/terms) * [Android Data Disclosure](https://developers.google.com/ml-kit/android-data-disclosure) * [iOS Data Disclosure](https://developers.google.com/ml-kit/ios-data-disclosure) ## Changelog[¶](#changelog "Permanent link") See [CHANGELOG.md](https://github.com/capawesome-team/capacitor-mlkit/blob/main/packages/face-mesh-detection/CHANGELOG.md). ## License[¶](#license "Permanent link") See [LICENSE](https://github.com/capawesome-team/capacitor-mlkit/blob/main/packages/face-mesh-detection/LICENSE). --- 1. This project is not affiliated with, endorsed by, sponsored by, or approved by Google LLC or any of their affiliates or subsidiaries. [↩](#fnref:1 "Jump back to footnote 1 in the text") May 17, 2026 Back to top