Object Detection

Detect objects in images with labeled bounding boxes using D-FINE (state-of-the-art DETR refinement) models.

For full API reference (detectObjects(), options, result types, and custom providers), see the Core Vision guide.

See it in action

Try Object Detector for a working demo.

Recommended Models

Model	Size	Objects	Use Case
`onnx-community/dfine_n_coco-ONNX`	~4.5MB	80 COCO classes	State-of-the-art, ultra-small (recommended)
`Xenova/detr-resnet-50`	~160MB	80 COCO classes	Classic transformer detection
`onnx-community/rtdetr_v2_r18vd-ONNX`	~40MB	80 COCO classes	Real-time object detection

Drawing Bounding Boxes

Based on the Object Detector showcase app:

import { transformers } from '@localmode/transformers';
import { detectObjects } from '@localmode/core';

const model = transformers.objectDetector('onnx-community/dfine_n_coco-ONNX');

const { objects } = await detectObjects({
  model,
  image: imageDataUrl,
  threshold: 0.5,
});

function drawDetections(
  ctx: CanvasRenderingContext2D,
  objects: DetectedObject[],
  imgWidth: number,
  imgHeight: number
) {
  objects.forEach((obj) => {
    const { x, y, width, height } = obj.box;

    // Draw bounding box
    ctx.strokeStyle = '#00ff00';
    ctx.lineWidth = 2;
    ctx.strokeRect(
      x * imgWidth,
      y * imgHeight,
      width * imgWidth,
      height * imgHeight
    );

    // Draw label
    ctx.fillStyle = '#00ff00';
    ctx.font = '14px sans-serif';
    ctx.fillText(
      `${obj.label} ${(obj.score * 100).toFixed(0)}%`,
      x * imgWidth,
      y * imgHeight - 5
    );
  });
}

Best Practices

Detection Tips

Adjust threshold — Lower threshold (0.3) catches more objects; higher (0.7) reduces false positives
Normalize coordinates — Box coordinates are normalized (0-1); multiply by image dimensions for pixels
COCO classes — D-FINE detects 80 COCO object categories (person, car, dog, etc.)
Image quality matters — Higher resolution images give more accurate detections