Running Meters
Running meters is an AI interface design pattern that displays live, ambient counters during agent execution for tokens consumed, dollars spent, and steps remaining, giving users ongoing visibility into scope and cost without demanding active attention. This UX pattern is the middle panel of the cost-awareness triad (forecast before, meter during, breakdown after), and it is the mechanism that catches divergence between prediction and reality early enough to intervene. The meter should be quiet when the run is on track and obvious when it is not, using typography and color the way a car dashboard uses a tachometer: unobtrusive at cruising speed, unmistakable in the red. Well-designed meters also expose the unit the user actually cares about (dollars, not just tokens, when a bill is attached) and update at a cadence that matches the speed of the underlying work.
Use Case
Essential for AI coding agents, research tools, and any long-running automation where users benefit from ambient visibility into token spend and progress while execution is in flight.
Examples in Wild
Use this pattern in your project
Copy this prompt to generate a production-ready implementation in Cursor, Claude Code, Lovable, or any AI coding agent.
Generate a production-ready implementation of the "Running Meters" AI interface design pattern.
Pattern Description:Task progress
42%Tokens
3,090
Cost
$0.68
ETA
5m
Related Patterns
Token Usage Indicator
API quota display
Processing Time Estimates
Expected wait times
Cost Transparency
Show operation costs
Rate Limit Warnings
API limit alerts
Caching Indicators
Show when cached results are used
Model Selection UI
Let users choose AI model (speed vs quality)
Get new patterns by email
Weekly AI interface UX notes and resources on Substack, no spam, unsubscribe anytime.