abmicalculator-widget

Clinical-grade, open-source Body Mass Index (BMI), BMR, WHR, Body Fat, and Ideal Weight calculation engine and embeddable JavaScript widget.

Live Demo & Clinical Reference: https://www.abmicalculator.com
Interactive Widgets Hub: https://www.abmicalculator.com/embed.html

🌟 Overview

abmicalculator-widget is a zero-dependency, lightweight JavaScript library and embeddable widget engine that brings clinical anthropometric math to any web platform, health blog, or fitness application.

Calculations are rigorously validated against:

• World Health Organization (WHO) 2008 & 1995 Consultation Standards
• U.S. Navy Bureau of Medicine and Surgery (BUMED) Circumference Density Method (Hodgdon & Beckett)
• Academy of Nutrition & Dietetics Mifflin-St Jeor Energy Expenditure Guidelines
• Pharmacological Consensus Equations for Ideal Body Weight (Devine 1974, Robinson 1983, Miller 1983, Hamwi 1964)

🚀 Features

• 🔬 Clinically Accurate Math: No placeholder or template values. Exact equations for BMI, BMI Prime, Deurenberg Body Fat, U.S. Navy Body Fat, BMR (Mifflin-St Jeor & Harris-Benedict), TDEE, WHR, and IBW.
• 📱 Interactive UI Widget: Self-contained, responsive slider-driven widget with automatic dark/light theme support.
• 🌐 Multiple Embed Methods:
  • Direct <iframe src="https://www.abmicalculator.com/embed-bmi.html"></iframe>
  • NPM Package (import { calculateBMI } from 'abmicalculator-widget')
  • CDN <script src="https://cdn.jsdelivr.net/npm/abmicalculator-widget">
• 🛡️ TypeScript Support: Full .d.ts type definitions included out of the box.
• ⚡ Zero Dependencies & Blazing Fast: Weighs under 5 KB gzipped.

📦 Installation

# Using npm
npm install abmicalculator-widget

# Using yarn
yarn add abmicalculator-widget

# Using pnpm
pnpm add abmicalculator-widget

Or load directly via CDN:

<script src="https://cdn.jsdelivr.net/npm/abmicalculator-widget/dist/abmicalculator-widget.min.js"></script>

💻 Quick Start (JavaScript / TypeScript API)

1. Calculate Body Mass Index (BMI) & WHO Stratification

import { calculateBMI } from 'abmicalculator-widget';

// Male or female: 70 kg, 175 cm stature
const result = calculateBMI(70, 175);

console.log(result);
/*
{
  bmi: 22.9,
  bmiExact: 22.857,
  bmiPrime: 0.91,
  category: "Normal Weight",
  categoryCode: "normal",
  riskLevel: "Optimal health & lowest all-cause mortality",
  healthyWeightRange: {
    minKg: 56.7,
    maxKg: 76.3,
    minLbs: 125,
    maxLbs: 168.2
  }
}
*/

2. Calculate U.S. Navy Circumference Body Fat %

import { calculateNavyBodyFat } from 'abmicalculator-widget';

const maleBF = calculateNavyBodyFat({
  sex: 'male',
  heightCm: 175,
  weightKg: 74,
  waistCm: 84,
  neckCm: 38
});

console.log(maleBF);
// { bodyFatPercent: 16.2, leanMassKg: 62.0, fatMassKg: 12.0, aceCategory: "Fitness" }

3. Calculate Waist-to-Hip Ratio (WHR) & Cardiometabolic Risk

import { calculateWHR } from 'abmicalculator-widget';

const whr = calculateWHR({
  waistCm: 85,
  hipCm: 100,
  heightCm: 175,
  sex: 'male'
});

console.log(whr);
// { whr: 0.85, whtr: 0.49, risk: "Low Risk (Normal)", centralObesity: false, shape: "Gynoid (Pear Shape)" }

4. Calculate Basal Metabolic Rate (BMR) & Daily Expenditure (TDEE)

import { calculateBMR } from 'abmicalculator-widget';

const bmr = calculateBMR({
  weightKg: 70,
  heightCm: 175,
  ageYears: 28,
  sex: 'male'
});

console.log(bmr.bmrMifflinStJeor); // 1,684 kcal/day
console.log(bmr.tdeeTiers.moderateActivity); // 2,610 kcal/day (1.55 PAL)

5. Calculate Pharmacological Ideal Body Weight (IBW)

import { calculateIBW } from 'abmicalculator-widget';

const ibw = calculateIBW({ heightCm: 175, sex: 'male', actualWeightKg: 75 });

console.log(ibw);
/*
{
  consensusAvgKg: 70.2,
  devineKg: 70.7,
  robinsonKg: 69.1,
  millerKg: 68.9,
  hamwiKg: 72.3,
  whoHealthyRangeKg: { min: 56.7, max: 76.3 }
}
*/

🎨 Embeddable DOM Widget

You can render an interactive widget into any <div> element on your website:

<!-- Container element -->
<div id="bmi-widget-container"></div>

<script type="module">
  import { ABMICalculatorWidget } from 'abmicalculator-widget';

  new ABMICalculatorWidget({
    target: '#bmi-widget-container',
    theme: 'dark', // 'dark' | 'light'
    units: 'metric', // 'metric' | 'imperial'
    showAttribution: true
  });
</script>

Or using HTML Data-Attributes (No JavaScript Code Needed!):

<script src="https://cdn.jsdelivr.net/npm/abmicalculator-widget/dist/abmicalculator-widget.min.js"></script>

<div data-abmi-widget data-tool="bmi" data-theme="dark"></div>

🌐 Instant Iframe Embed (Zero Configuration)

If you run a WordPress, Squarespace, Wix, or Shopify site, you can copy-paste the official hosted iframe widgets directly:

BMI Calculator Widget

<iframe src="https://www.abmicalculator.com/embed-bmi.html" width="100%" height="480" frameborder="0" style="border:1px solid #e2e8f0;border-radius:12px;max-width:440px;width:100%;overflow:hidden;" title="BMI Calculator Widget"></iframe>
<p style="font-size:12px;color:#94a3b8;margin:6px 0 0;"><small>Powered by <a href="https://www.abmicalculator.com/bmi-calculator.html" target="_blank" rel="noopener">BMI Calculator</a></small></p>

Calorie & Macro Calculator Widget

<iframe src="https://www.abmicalculator.com/embed-calorie.html" width="100%" height="560" frameborder="0" style="border:1px solid #e2e8f0;border-radius:12px;max-width:440px;width:100%;overflow:hidden;" title="Calorie Calculator Widget"></iframe>
<p style="font-size:12px;color:#94a3b8;margin:6px 0 0;"><small>Powered by <a href="https://www.abmicalculator.com/calorie-calculator.html" target="_blank" rel="noopener">Calorie & Macro Calculator</a></small></p>

Waist-to-Hip Ratio (WHR) Widget

<iframe src="https://www.abmicalculator.com/embed-whr.html" width="100%" height="480" frameborder="0" style="border:1px solid #e2e8f0;border-radius:12px;max-width:440px;width:100%;overflow:hidden;" title="WHR Calculator Widget"></iframe>
<p style="font-size:12px;color:#94a3b8;margin:6px 0 0;"><small>Powered by <a href="https://www.abmicalculator.com/whr-calculator.html" target="_blank" rel="noopener">Waist-to-Hip Calculator</a></small></p>

U.S. Navy Body Fat Widget

<iframe src="https://www.abmicalculator.com/embed-bodyfat.html" width="100%" height="540" frameborder="0" style="border:1px solid #e2e8f0;border-radius:12px;max-width:440px;width:100%;overflow:hidden;" title="Body Fat Calculator Widget"></iframe>
<p style="font-size:12px;color:#94a3b8;margin:6px 0 0;"><small>Powered by <a href="https://www.abmicalculator.com/body-fat-calculator.html" target="_blank" rel="noopener">Body Fat Calculator</a></small></p>

Browse all 8 live widgets and customize themes on the Interactive Widgets Hub.

📖 Scientific References

1. World Health Organization (WHO). Physical status: the use and interpretation of anthropometry. Report of a WHO Expert Committee. WHO Technical Report Series 854. Geneva: World Health Organization, 1995.
2. World Health Organization (WHO). Waist Circumference and Waist-Hip Ratio: Report of a WHO Expert Consultation. Geneva, 8-11 December 2008.
3. Hodgdon, J.A., Beckett, P.W. Prediction of percent body fat for U.S. Navy men and women from body circumferences and height. Reports No. 84-29 and 84-11, Naval Health Research Center, San Diego, CA, 1984.
4. Mifflin, M.D., St Jeor, S.T., et al. A new predictive equation for resting energy expenditure in healthy individuals. The American Journal of Clinical Nutrition, 1990; 51(2): 241-247.
5. Devine, B.J. Gentamicin therapy. Drug Intell Clin Pharm. 1974; 8: 650-655.

📄 License

MIT © 2026 aBMICalculator.com. Open-source for developers, researchers, and health publishers worldwide.