Outdoor air quality is a major focus in Europe in 2025, with tighter standards placing greater emphasis on fine particulate matter—especially PM2.5. Elevated PM levels are linked to asthma, reduced cognitive performance, and increased cardiovascular risk, making reliable monitoring essential. This project demonstrates a simple, browser-based way to visualize PM1.0, PM2.5, and PM10 in real time—supporting better ventilation decisions and aligning with evolving EU air-quality expectations.

What you’ll build

A single HTML file styled with Tailwind CSS that:

• Puts BleuIO in a central scanning role
• Periodically runs a targeted scan for your HibouAir Board ID
• Decodes PM1.0 / PM2.5 / PM10 from the manufacturer data inside BLE advertisements
• Maps the values to three horizontal bars (default display windows: PM1.0/PM2.5 → 0–150 µg/m³, PM10 → 0–200 µg/m³)
• Shows a high particulate banner when any value exceeds your thresholds

Source code: https://github.com/smart-sensor-devices-ab/pm-monitor-bleuio
Live demo: https://smart-sensor-devices-ab.github.io/pm-monitor-bleuio/

Hardware & software

• BleuIO USB BLE dongle
• HibouAir air quality monitor with particle sensor

How it works

HibouAir broadcast short advertisement packets that includes real-time air quality data. We can read them without pairing.

Scan cadence. The dongle sends:

• AT+CENTRAL once to enter scanning mode
• AT+FINDSCANDATA=<BOARD_ID>=3 every cycle to run a 3-second targeted scan
• It reads lines until BleuIO prints SCAN COMPLETE, then waits and repeats

Decoding. HibouAir advertises a compact environmental frame beginning with the marker 5B 07 05. PM values are 16-bit little-endian fields. In this build we anchor to the marker and read:

• PM1.0 (raw ÷ 10 → µg/m³)
• PM2.5 (raw ÷ 10 → µg/m³)
• PM10 (raw ÷ 10 → µg/m³)

UI behavior. Each metric drives a bar that fills left-to-right as the value rises within its display window. Thresholds are configurable (defaults: PM1.0 1, PM2.5 2, PM10 5 µg/m³). If any metric is at or above its threshold, the page shows “High particulate levels detected.”

Customize & extend

You can tailor this monitor to your space and workflow in several practical ways. If you anticipate larger spikes, widen the display windows—for example, expand PM2.5 to 0–200 µg/m³—to keep the bar responsive at higher ranges. For lightweight analytics, append readings to a CSV file or store them in IndexedDB to explore trends over hours or days. If you’re tracking multiple HibouAir units, build a wallboard that scans a list of Board IDs and renders compact tiles for each sensor in a single view. To act on thresholds, add automation hooks that trigger a webhook or drive a fan/relay from a companion script when levels rise. Finally, pair this particulate display with your existing CO₂ or Noise monitors to create a more complete picture of indoor conditions and ventilation effectiveness.

Output

In the video , the session starts at 0.0 µg/m³ across PM1.0/PM2.5/PM10. To demonstrate responsiveness, we briefly spray aerosol near the HibouAir device. Within seconds, the bars respond and the page displays “High particulate levels detected.” After stopping the aerosol and allowing air to clear, values decay back down, the bars recede, and the banner disappears. This sequence illustrates typical behavior you’ll see during quick particulate events (e.g., cleaning sprays, dust disturbances, smoke from cooking) and their recovery.

This project turns HibouAir’s BLE adverts into a clear view of PM1.0, PM2.5, and PM10 using a BleuIO dongle. In minutes, you get live bars, thresholds, and a simple alert that makes particulate spikes obvious. It’s easy to tune—adjust display windows, tweak thresholds, and adapt the layout for different rooms. As EU air-quality expectations tighten, this lightweight monitor helps you spot issues and validate ventilation quickly. From here, you can add data export, multi-device dashboards, or pair it with your CO2 monitor for a fuller picture.