PaceUI

Intro
Agents
Crafts
Charts
Motion
PreviousNext

Spend Allocation

A donut pie chart displaying provider spend allocation, total cost summary, and average pricing rates per 1K tokens.

When to use

  • Multi-provider AI cloud spend allocation (OpenAI, Anthropic, Google Cloud, Groq).
  • Donut pie charts displaying total expenditure, percentage shares, and average pricing rates per 1K tokens.
  • AI infrastructure cost optimization, FinOps reviews, and vendor rate comparisons.

When not to use

  • Tracking hourly performance latency or raw API uptime.
  • Timeline progression charts where month-over-month trends are needed.

Props

PropTypeDefaultDescription
dataProviderSpendItem[]defaultProviderDataArray of AI/Cloud provider spend allocations with provider name, dollar spend, avg rate per 1K, and fill color.
classNamestring—Optional custom CSS classes for the card container.

Data Structure

FieldTypeDescription
providerstringCloud or AI provider company name (e.g., OpenAI, Anthropic).
spendnumberTotal invoice spend in dollars attributed to this provider.
avgPer1kstringFormatted average token rate rate per 1K tokens (e.g., $0.032).
fillstringSemantic theme color token assigned to the provider slice.