Shared UI system
One stylesheet, every tool. Anchored on the marketing site brand so the portal, the tools, and synergysafetygroup.com read as one product.
i
Every color below passed the palette validator: lightness band, chroma floor, colorblind separation, normal-vision separation, and contrast. Nothing here was picked by eye.
Brand + surfaces
Status — reserved, never used for a chart series
Compliant
Review due
Face-to-face
Out of service
No data
Categorical — fixed order, never cycled
Sequential (magnitude) & diverging (polarity)
Sequential — one hue, light to dark
Diverging — two poles, neutral gray midpoint
Buttons
Stat tiles
Active drivers
247
Events, 30 days
1,284
▼ 18% vs prior 30
Coaching complete
92%
▲ 6 pts
Face-to-face open
7
Cards, notes, forms
Log an observation
Upstream framing: never "why," always "what allowed it."
Draft saved 2 min ago
!
Out-of-service order. Unit 214 cannot dispatch until the defect is cleared.
!
3 medical cards expire in the next 14 days.
✓
Report delivered to 4 recipients.
Enter a valid work email address.
Analyzing footage…
Filters + chart
Camera events by month
Three behavior types, rolling 8 months. Hover for values.
Following distance
Phone use
Drowsiness
Events by territory
North412
West301
Panhandle221
South137
East71
| Driver | Behavior | Events | Status |
|---|---|---|---|
| Rubio, Miguel | Phone use | 14 | Face-to-face |
| Ochoa, Daniel | Drowsiness | 9 | Safety review |
| Vela, Andres | Following | 6 | Coaching notes |
| Guerra, Luis | Following | 3 | Cleared |
| Salas, Efrain | Phone use | 1 | Cleared |
No events in this range
Widen the date range or clear a filter.
White-label
i
Panhandle Express and CRS tools keep the same layout, spacing, and components and override only the brand tokens via
data-brand. One stylesheet, never a fork. Hit Preview: PEX brand up top to repaint this page.Brand accent■
Components1
Stylesheet forks0