React Equipment / OEE Card

OEE is the one number that survives a plant review — and on its own it hides which lever to pull. This card shows Availability, Performance, and Quality alongside their product, and puts a downtime Pareto underneath so the availability figure comes with an explanation attached.

EQ-07 · Etch chamber A

Night shift · 20 Jul

76.4% OEE
Typical
AAvailability84.2%
PPerformance91.3%
QQuality99.4%
84.2%×91.3%×99.4%=76.4%

Downtime by reason

195 min lost
  • Turbo pump fault94m · 48%
  • Recipe changeover42m · 22%
  • Material starve28m · 14%
  • Scheduled PM20m · 10%
  • Minor stops11m · 6%
Unplanned Planned

Installation

npx shadcn@latest add "https://kelvinui.com/registry/oee-card.json"

Props

PropTypeDescription
equipmentstringTool / line name
shiftstringPeriod label
availabilitynumber0–1
performancenumber0–1
qualitynumber0–1
downtimeDowntimeReason[]{ reason, minutes, planned? }
benchmarknumberWorld-class threshold (default 0.85)

Show the factors, not just the product

OEE is A × P × Q, and the same 76% can be a scheduling problem or a scrap problem depending on which factor is dragging. So the card never shows the headline alone: the three factors each get a bar coloured against their own health, and the multiplication is spelled out — 84.2% × 91.3% × 99.4% = 76.4% — so the weak link is impossible to miss. The rating (World-class, Typical, Low, Critical) is measured against a configurable benchmark, defaulting to the conventional 85%.

The Pareto turns a number into an action

An 84% availability is a fact; "94 minutes lost to a turbo-pump fault, 42 to changeover" is a to-do list. The downtime breakdown sorts reasons longest-first and separates unplanned loss (red — the fault you can attack) from planned loss (grey — PM and changeover you can only optimise), because treating a scheduled PM like an outage sends improvement effort at the wrong target. Each reason shows its share of total downtime, so the one worth a project stands out from the noise.

New components every week

Get the week's new Kelvin UI components and templates in one short email. No spam, unsubscribe anytime.