Tier 1Web (www / app / auth). The full design system: our component library and the components.css recipe. This is the one tier where the recipe is the contract, native tiers take the tokens and nothing else.--yellow-solid · --green-solid · --solid · --component-bg-hover
Storage bar · sidebar, under the nav
One yellow 6px progress bar, one caption, a gear to Settings › Storage. Same bar in the user menu and family member rows. No percent, no warn colour.
Simple · used · default
11 TB of 50 TB used
Simple · free
39 TB of 50 TB free
Detailed · used · GB once the plan is 1 TB+
11264 GB of 51200 GB used
Settings › Storage sets both:
· Disk usage display format: Simple / Detailed
· Disk usage display type: free or used

app.put.io draws it with theme-ui Progress (radius 4, track border) and a flaticon gear, not Phosphor.
Type breakdown · warn · over proposed
Not in app.put.io: the bar stays yellow at any fill.
32.4 TB of 50 TB
65%
Video · 19.0 TB Audio · 6.0 TB Docs · 2.5 TB Archive · 3.0 TB Other · 1.9 TB
82 GB of 100 GB
82%
97 GB of 100 GB
97% · cleanup needed
In-app upsell proposed
Not in app.put.io. Plan changes live in Settings › Billing.
You've cleaned up 14 GB this month.

Based on your usage, 1 TB would save you ~3 hours of cleanup per month.