Your interface. A body in 3D.

Embed BodyDouble by SeamScape and build the controls yourself. Try the measurements below: every input on this page lives outside the embedded 3D viewer.

Measurements

Four synthetic inputs, in centimetres. Clear a field to let BodyDouble predict it. The API returns the other supported fields too, even though this form does not show them.

Focus a supported measurement to show its marking.

The live demo is not connected yet.

Add it to your site

Use your public site key and add your website to its allowed domains. This example pins release 1.0.2; your integration does not automatically upgrade.

<div id="body-view" style="height: 520px"></div>
<script type="module">
  import { mount } from "https://embed.bodydbl.com/1.0.2/viewer.js";

  let viewer;
  try {
    viewer = mount({
      target: '#body-view',
      siteKey: "bd_site_YOUR_PUBLIC_SITE_KEY"
    });
    const capabilities = await viewer.ready;
    viewer.on('profile', profile => {
      // All supported fields, including predictions for fields absent from your UI.
      // Each field includes { value, unit, source: 'input' | 'predicted' }.
      console.log(profile.fields);
    });
    await viewer.setProfile({
      schemaVersion: 1,
      gender: 'female',
      unitSystem: 'metric',
      fields: { height: 168, chestGirth: 91, waistGirth: 72, hipGirth: 99 }
    });
    // Call this from your own field's focus handler:
    await viewer.showMeasurement('waistGirth', { autoZoom: true });
  } catch (error) {
    viewer?.destroy();
    document.querySelector('#body-view').textContent =
      '3D preview unavailable. You can continue entering measurements.';
  }
  // On SPA navigation/unmount: viewer?.destroy();
</script>

Start with a branded integration

The free embed includes “Powered by SeamScape”. Pro supports your own colors and an unbranded view. Pilot access and Pro activation are handled by SeamScape; self-service billing is not available yet.