Designing cost-aware UX

Show users what an AI request costs before and after it runs, without cluttering the interface.

Every Relixr response includes cost and model metadata. The design question isn't whether to surface it — it's how much, and when.

Three places cost shows up

• Per-response, inline. A small "$0.0021 · gpt-4o-mini" caption under a completed response. Low-attention, always available, never blocks the interaction.
• Per-session, aggregated. A running total in a sidebar or header — useful once a session involves several requests, so users don't have to add up individual lines themselves.
• Pre-request, when it matters. If your UI lets a user pick between a fast/cheap model and a slow/expensive one, show the price difference at the point of choice, not buried in settings.

What to avoid

• Don't show raw token counts to end users — cost in currency is the unit people actually reason about.
• Don't show cost with more precision than the currency supports mentally — four decimal places on a dollar amount reads as noise, round for display and keep precision in the underlying data.
• Don't gate the response on the cost figure loading — render the content first, backfill the cost caption when it arrives.

Implementation note

Relixr returns cost on the response object itself (see Headers & metadata), so there's no second request needed to display it — read it off the same response you already rendered.