Official Circadify SDK for Web applications. Measure vital signs contactlessly using your device's camera.
Face detection and ROI extraction happen on-device — only 72×72 pixel patches are uploaded, never raw video.
npm install @circadify/sdkYou'll need an API key to use the SDK. Sign up at developer.circadify.com after reaching out to us at circadify.com/contact-us.
import { CircadifySDK } from '@circadify/sdk';
const circadify = new CircadifySDK({
apiKey: 'YOUR_API_KEY',
});
// SDK mounts video + face guide + progress bar in your container
const result = await circadify.measureVitals({
container: document.getElementById('scan-container'),
});
console.log(result.heartRate, 'BPM');const circadify = new CircadifySDK({
apiKey: 'YOUR_API_KEY',
onProgress: (event) => console.log(`${event.phase}: ${event.percent}%`),
});
// No container = no UI rendered, just callbacks
const result = await circadify.measureVitals();const circadify = new CircadifySDK({
apiKey: 'YOUR_API_KEY',
// Optional
baseUrl: 'https://api.circadify.com',
measurementDuration: 30,
debug: true,
// Callbacks
onProgress: (event) => {
console.log(`${event.phase}: ${event.percent}%`);
},
onQualityWarning: (warning) => {
console.log(`Quality issue: ${warning.message}`);
},
// Self-host WASM files (optional)
wasmConfig: {
mediapipeWasmUrl: 'https://your-cdn.com/mediapipe/wasm',
mediapipeModelUrl: 'https://your-cdn.com/mediapipe/face_landmarker.task',
opencvUrl: 'https://your-cdn.com/opencv.js',
},
});const result = await circadify.measureVitals({
// Mount built-in scanning UI in this element
container: document.getElementById('scan'),
// Customize scanning UI
ui: {
showFaceGuide: true, // Face oval overlay
showThermalGlow: true, // Thermal glow animation during scan
showQualityIndicators: true, // Status banner
accentColor: '#00D4FF', // UI accent color
borderRadius: '16px', // Video container radius
},
// Improve accuracy with demographics
demographics: { age: 35, sex: 'M', fitzpatrick: 3 },
// Cancellation
signal: abortController.signal,
});Starts measurement. Pass container for built-in UI, omit for headless mode.
Checks camera availability.
Returns device camera info.
Cleans up all resources (WASM, camera, UI).
interface VitalSignsResult {
heartRate: number;
hrv?: number;
respiratoryRate?: number;
spo2?: number;
systolicBp?: number;
diastolicBp?: number;
confidence: number; // 0-1
timestamp: number;
sessionId: string;
}- WASM loads — MediaPipe Face Mesh + OpenCV.js from CDN (~6MB, cached)
- Quality gate — Face detected, lighting/motion/pose checks pass
- Frame capture — 30fps loop extracts 3 face ROIs per frame (forehead, cheeks)
- Binary encoding — 720 frames × 12 channels × 72×72 → ~44.8MB tensor
- Upload + inference — Binary tensor uploaded, server returns vital signs
| Browser | Minimum |
|---|---|
| Chrome | 80+ |
| Firefox | 75+ |
| Safari | 14+ |
| Edge | 80+ |
Requires HTTPS (or localhost) for camera access.
| Format | Size |
|---|---|
| ESM | ~38 KB |
| CJS | ~38 KB |
WASM dependencies (~6MB) are loaded at runtime from CDN and cached by the browser.
MIT © A.Y. Health Technologies Inc.