Fictional example data. Every name, date and value on these pages is made up. No real patient information appears here.
Dataviz / Charts
Labs trend
Search finds a test by name. Out-of-range results are listed first. All and Abnormal stay on the row. Clinical areas open in one menu, grouped by name. One chart opens on All. On a narrow screen the list is the screen until a row opens the chart. Reference limits are labeled lines on a scale that includes them. The date and value table sits under that chart.
- Reference range
- 10-20
- Unit
- U/L
- Result date
- Sep 16, 2030
- Reference range
- 10–20
- Unit
- U/L
- Result date
- Oct 1, 2026
- Reference range
- 10–20
- Unit
- U/L
- Result date
- Sep 24, 2026
- Reference range
- 10–20
- Unit
- U/L
- Result date
- Sep 24, 2026
- Reference range
- 10-20
- Unit
- U/L
- Result date
- Sep 8, 2030
- Reference range
- 10–20
- Unit
- U/L
- Result date
- Sep 20, 2026
- Reference range
- No reference range
- Unit
- U/L
- Result date
- Jan 1, 2026
- Reference range
- 10–20
- Unit
- U/L
- Result date
- Jan 2, 2024
- Reference range
- 10–20
- Unit
- U/L
- Result date
- Jan 2, 2024
- Reference range
- 10–20
- Unit
- U/L
- Result date
- Jan 2, 2024
- Reference range
- 10–20
- Unit
- U/L
- Result date
- Jan 2, 2024
- Reference range
- 10–20
- Unit
- U/L
- Result date
- Jan 2, 2024
- Reference range
- 10–20
- Unit
- U/L
- Result date
- Jan 2, 2024
Example lab
28 U/L · High · Ref 10–20 U/L · Sep 24, 2026
Left and Right arrows move between results. Enter opens a cluster. Escape leaves a cluster or returns to the latest result.
| Date | Value |
|---|---|
| Sep 24, 2026 | 28 U/L · High |
| Sep 18, 2026 | 18 U/L · In range |
| Sep 12, 2026 | 16 U/L · In range |
| Sep 6, 2026 | 8 U/L · Low |
Contract
One chart for the selected test. Reference limits are labeled lines, and the vertical scale includes them. Out-of-range points use a distinct shape and the words High, Low, or Abnormal. Overlapping points share one mark with a count and Abn. Whole results use whole-number axis labels. A date and value table follows the chart. Time controls are 30d, 90d, 1y, and All. All is the default.
| Element | Token | Contract |
|---|---|---|
| Series | --ds-color-dataviz-line-default | Time series. Horizontal axis is time. |
| Reference | --ds-color-dataviz-reference-band | Labeled hairline limits. The scale includes them. |
| High | --ds-color-dataviz-point-abnormal-high | Triangle plus the word High |
| Low | --ds-color-dataviz-point-abnormal-low | Diamond plus the word Low |
| Abnormal | --ds-color-dataviz-point-abnormal-high | Square plus the word Abnormal |
| Grid | --ds-color-dataviz-grid | Light grid |
| Flag text | --ds-text-destructive | High, Low, and Abnormal are written |
| Focus | --ds-chart-focus-ring | Crisp 2px ring, no blur |
| Value | --ds-type-stat-size | Value, unit, flag, reference, and specimen date on one line |
| Cluster count | --ds-text-primary | Count when results overlap |
| Cluster abnormal | --ds-text-destructive | Abn beside the count when any member is out of range |
| Time control | --primitive-dimensions-11 | 30d, 90d, 1y, All. All is the default. 44px target. |