Should AI products use credits or show real costs?

Credits are easier to explain across features with different costs and give you room to change pricing behind the scenes. Real dollar costs suit developer and API products, where users expect metered billing. Whichever you pick, translate usage into something users recognize, such as tasks or reports, and keep the conversion between credits and real costs easy to find.

Should unused AI credits roll over?

That's a pricing decision rather than a design one, but the interface must make the rule obvious. If credits expire, show the expiry date on the meter and warn before it. If they roll over, show how much carried forward and whether there's a cap. Hidden expiry rules are a common source of support tickets and refund requests.

How do you stop users rationing an AI product they pay for?

Reduce uncertainty. Users ration when they can't predict cost or fear hitting a wall mid-task. Show remaining usage in tasks, preview cost only on expensive actions, don't charge for failures and warn early before limits. If most users stay well under their allowance, consider hiding the meter until they approach it.

Should free plans show a credit meter?

Yes, but keep it calm. Free users are more likely to hit limits, and a visible meter helps them understand what the plan includes. Pair the meter with the reset time and a clear explanation of what paid plans add. Avoid turning every interaction into an upgrade prompt, which pushes free users away before they see the product's value.

How should team plans handle shared AI credits?

Show the shared pool and each member's share of usage, let admins set per-member or per-feature limits and notify admins as the pool runs low. When a member hits a team limit, tell them who can add credits and let them request more in one click. That keeps members working instead of searching for whoever handles billing.

All posts

Product design

Pricing and Usage UX for AI Products: Credits, Limits and Cost Transparency

AI credits UX that users trust: credit meters, cost previews before expensive actions, warnings before limits and limit-hit flows that don't lose work.

By Mehdi HassanOct 29, 20267 min read

The short answer

AI credits UX should make usage predictable before, during and after each action. Translate credits into tasks users understand, show a meter where usage happens, preview the cost of expensive actions, warn well before limits, and design the limit-hit moment so users keep their work and see clear options. Surprise is what makes AI pricing feel unfair.

Key takeaways

Express credits as tasks users recognize, such as about 40 reports left, not raw tokens.
Preview the cost before expensive actions, and charge nothing for failed or stopped generations where possible.
Warn at sensible thresholds before the limit, in the product, not only by email.
When users hit a limit, keep their prompt and work and show every option: wait, upgrade or buy more.
Give admins a usage breakdown by person and feature so they can explain the bill internally.

Part of AI Product UX: How to Design AI Features Users Trust

How should AI products show credits, usage and limits to users?

AI products should show credits as a simple meter in the places where usage happens, translated into tasks users understand, with a cost preview for expensive actions and clear warnings before any limit. The goal is that no user is surprised by a limit or a bill.

Usage-based pricing is common in AI products because every request has a real compute cost. That makes billing part of the everyday interface, not just a settings page. Done badly, it creates anxiety: users ration a product they're paying for, or hit a wall mid-task. This guide covers the in-product side. For how credits are explained on the marketing site, see our guide to AI pricing page design. It's part of our hub on AI product UX.

What makes good AI credits UX?

Good AI credits UX is predictable, honest and close to the action. Users should know roughly what an action will cost before they take it, how much they have left while they work, and what will happen when they run out, long before they do.

Moment	User question	Pattern
Before an action	What will this cost?	Cost preview on expensive actions
While working	How much do I have left?	Compact meter near the input or in the header
Approaching a limit	Am I about to run out?	Inline warning at set thresholds
At the limit	What now, and is my work safe?	Limit-hit screen with saved work and options
After the period	Where did it all go?	Usage history by feature and person

These moments map to different parts of the product: the composer, the header, the billing page and the admin console. Design them together, because users judge the whole experience by its worst moment, which is usually the limit.

How should a credit meter display usage?

A credit meter should show remaining usage in units users recognize, close to where they spend it, and stay quiet until it matters. A bar near the input or in the account menu is enough for most products, with detail one click away.

Translate credits into tasks. About 40 reports left is clearer than 4,000 credits. Keep the raw number available for those who want it.
Show the reset date. Resets on the 1st, or Resets in 6 hours for rolling limits, answers the next question.
Separate pools clearly. If users have plan credits, purchased credits and a daily cap, label each and say which is used first.
Stay calm until it matters. A small neutral meter most of the time, a stronger color only near the limit.
Don't show token usage display to everyone. Tokens mean something to developers and nothing to most users. Offer them in a detail view or for API products.

Should AI products preview the cost of an action?

Yes, AI products should preview the cost of any action that uses noticeably more credits than usual, such as a long report, a batch job or a high-quality image. A short line on the button, like Generate report, about 50 credits, lets users decide before spending.

Routine, cheap actions don't need a preview; adding one to every message makes users feel billed per sentence. For variable-cost actions, show a range, and settle the final cost afterward. Where possible, don't charge for failed or stopped generations, and say so in the interface. Users who know a timeout won't cost them are far less anxious about trying. Our guide to AI loading states covers the stop and failure states these rules apply to.

For example, suppose a research tool offers quick and deep modes

For example, suppose an AI research tool offers Quick answer and Deep research. Quick answers show no cost preview because they're cheap and frequent. The Deep research button reads Start deep research, uses about 10% of this month's credits, with a link to see what's included. If the job fails partway, the result screen says No credits used for the failed part.

This hypothetical walkthrough shows how cost previews can be selective rather than everywhere.

How should AI usage limits UI warn users?

AI usage limits UI should warn users in the product at clear thresholds before the limit, with options attached. Email warnings alone arrive too late or get missed, so the warning belongs where the user is working.

First warning, early
A quiet inline note when a meaningful share of the allowance is used: You've used most of this month's credits. Resets on the 1st.
Second warning, near the limit
A more visible note with options: About 5 reports left. Buy more or upgrade.
Notify the right person
On team plans, tell the admin who can act, not only the member who hit it. Members shouldn't be stuck waiting without knowing who to ask.
Let users set their own alerts
Admins on usage-billed plans often want a spend alert or a hard cap. Make both easy to set.

What should happen when users hit an AI usage limit?

When users hit an AI usage limit, the product should keep their work, explain the limit plainly and show every option on one screen: wait for the reset, buy more credits, upgrade or ask an admin. The worst version blocks the request, discards the prompt and shows an upgrade modal with no other choice.

Pros

Saved prompts and drafts mean nothing is lost while users decide
Showing the reset time respects users who'd rather wait
One-click top-ups resolve urgent cases without a plan change

Cons

Hard stops mid-task feel punitive even when the limit is fair
Upgrade-only paths read as a sales trap
Soft overages without a cap can create bill shock for admins

If the request was already running, let it finish and stop the next one, rather than cutting off an answer halfway. Tell users which features still work without credits, such as viewing history or editing drafts. The broader billing flow, including plan changes and paywalls, is covered in our guide to in-app billing and upgrade UX.

How do you make AI usage transparent for admins?

Make AI usage transparent for admins with a usage page that breaks consumption down by person, feature and time, and ties it to the bill. Admins usually need to explain costs to someone else, and a single total gives them nothing to work with.

Show usage per member and per feature, trends over the period, the top consumers and projected usage at the current pace. Offer export for finance teams. Let admins set limits per member or per feature, so one heavy user doesn't exhaust the whole team's allowance. The pricing model shapes all of this, so align the in-product view with how plans are sold; our guide to pricing pages for usage-based and AI products covers the marketing side. If you'd like help designing credit meters and limit flows, our $3,000 brand & design sprint explores them in Figma as a fixed-scope project.

Frequently asked questions

Should AI products use credits or show real costs?: Credits are easier to explain across features with different costs and give you room to change pricing behind the scenes. Real dollar costs suit developer and API products, where users expect metered billing. Whichever you pick, translate usage into something users recognize, such as tasks or reports, and keep the conversion between credits and real costs easy to find.
Should unused AI credits roll over?: That's a pricing decision rather than a design one, but the interface must make the rule obvious. If credits expire, show the expiry date on the meter and warn before it. If they roll over, show how much carried forward and whether there's a cap. Hidden expiry rules are a common source of support tickets and refund requests.
How do you stop users rationing an AI product they pay for?: Reduce uncertainty. Users ration when they can't predict cost or fear hitting a wall mid-task. Show remaining usage in tasks, preview cost only on expensive actions, don't charge for failures and warn early before limits. If most users stay well under their allowance, consider hiding the meter until they approach it.
Should free plans show a credit meter?: Yes, but keep it calm. Free users are more likely to hit limits, and a visible meter helps them understand what the plan includes. Pair the meter with the reset time and a clear explanation of what paid plans add. Avoid turning every interaction into an upgrade prompt, which pushes free users away before they see the product's value.
How should team plans handle shared AI credits?: Show the shared pool and each member's share of usage, let admins set per-member or per-feature limits and notify admins as the pool runs low. When a member hits a team limit, tell them who can add credits and let them request more in one click. That keeps members working instead of searching for whoever handles billing.

Mehdi Hassan · CEO & Design Director

Copywriter, designer and developer, and founder of Designify Studio. Over five years, 60+ projects across 14+ industries, for startups that have raised $300M+.

Want this done for you? Brand & design sprint, $3,000.

A brand refresh or redesign, plus design explorations for your website and product. $3,000, one-time, fixed price. Book a free 30-minute call to see if it fits.

Schedule Call