BMI Range Indicators is a premium set of 3 health-style BMI widgets for FlutterFlow/Flutter that visualize a user’s BMI on a color-coded range scale — just like modern fitness and wellness apps 📊🏃‍♂️. It helps users instantly understand their category (Underweight, Healthy, Overweight, etc.) with a clean indicator, clear ticks, and fully customizable typography and layout.

What’s included (3 widgets)

📌 Compact BMI range bar with a marker and category label
📏 Detailed scale with ticks/segments for more precise reading
🎯 Large “dashboard” style indicator with prominent BMI value + status text

Functionality

🧮 Calculates and displays BMI from userHeight and userWeight (or accepts a BMI value if your flow already computes it)
🎨 Color-coded BMI ranges with adjustable segment sizes and spacing (segmentGap, dividerWidth)
📍 Movable marker/slider indicator for the current BMI value
🔤 Full typography control: numberFontSize, statusFontSize, labelsFontSize
📐 Layout controls: barHeight, barWidth, barRadius, padding, margins, tick/legend spacing
📱 Tested on real devices and optimized for smooth performance
🎨 Fully customizable to match any fitness, health, or medical app UI

Perfect for

🏋️ Fitness & weight tracking apps
🥗 Nutrition and meal planning apps
🩺 Health check / wellness dashboards
📈 Progress & onboarding screens (BMI summary)
👩‍⚕️ Clinics / patient portals (BMI indicator block)

Why it improves UX

Numbers alone don’t help users. A BMI range indicator gives instant context, reduces confusion, and makes your app feel “professional health-grade” without building complex charts.

🔎 SEO Keywords: BMI range indicator flutterflow, BMI widget flutter, BMI scale bar UI, fitness BMI indicator widget, BMI calculator widget flutterflow, health dashboard BMI chart, underweight healthy overweight BMI bar, weight tracker BMI component, color coded BMI ranges, wellness app BMI UI widget