Gauges & Charts
Need Gauge
Dashed ring around a need icon (Rest, Food, Water…), alone or in the action queue.
Source captures·from the SEED early-access trailer
Needs panel
The Mind tab’s needs grid. Rings fill counter-clockwise from the top.
Needs
Rest
Leisure
Food
Water
Hygiene
Bladder
Comfort
Social
HUD needs tray
Clickable rings without labels; hover shows the need and its level.
Level & tone
Tone follows the level unless set explicitly.
Food · 64%
100%
70%
40%
18%
6%
blue
Sizes & segments
sm
default
lg
6 segments
14 segments
58API
| Prop | Type | Default | Description |
|---|---|---|---|
| icon | LucideIcon | — | |
| label | string | — | Shown below and used as the accessible name. |
| value | number | — | 0–100. |
| tone | "auto" | "green" | "lime" | "orange" | "red" | "blue" | "auto" | |
| size | "sm" | "default" | "lg" | "default" | |
| segments | number | 9 | |
| showLabel | boolean | true | |
| NeedButton | component | — | Clickable ring for the HUD tray. |
| NeedRing | component | — | Ring only, with any center content. |
| needs | Record<need, { label, icon }> | — | Rest, Leisure, Food, Water, Hygiene, Bladder, Comfort, Social, Energy. |