Skip to main content

Check out Port for yourself ➜ 

Visualize Claude metrics

This guide demonstrates how to set up a monitoring dashboard to gain insights into your Claude API usage using Port. You'll learn how to visualize key metrics like token consumption, costs, model distribution, cache efficiency, and track Claude Code activity over time.

Common use cases​

  • Monitor Claude API token consumption trends.
  • Track API costs and optimize spending across models.
  • Analyze model distribution to understand which Claude models are used most.
  • Monitor cache efficiency to optimize costs.
  • Track Claude Code sessions, commits, and pull requests.

Prerequisites​

This guide assumes the following:

Create the dashboard​

  1. Navigate to your software catalog.

  2. Click on the + New button in the left sidebar.

  3. Select New dashboard.

  4. Name the dashboard Claude AI Insights.

  5. Input Monitor Claude API usage, costs, and performance metrics under Description.

  6. Select the Claude icon.

  7. Click Create.

You now have a blank dashboard where you can add widgets to visualize your Claude metrics.

Add widgets​

Create the following widgets to gain insights into your Claude API usage:

Total output tokens widget​

Total output tokens (click to expand)

  1. Click on + Widget and select Number Chart.

  2. Fill in the following details:

    • Title: Total Output Tokens.
    • Description: Total output tokens generated by Claude.
    • Icon: BlankPage.
    • Blueprint: claude_usage_record.
    • Chart type: Select Aggregate by property.
    • Property: output_tokens.
    • Function: Sum.

  3. Click Save.

Total cost widget​

Total cost (click to expand)

  1. Click on + Widget and select Number Chart.

  2. Fill in the following details:

    • Title: Total Cost (USD).
    • Description: Total cost of Claude API usage.
    • Icon: DollarSign.
    • Blueprint: claude_cost_record.
    • Chart type: Select Aggregate by property.
    • Property: amount.
    • Function: Sum.

  3. Click Save.

Total web searches widget​

Total web searches (click to expand)

  1. Click on + Widget and select Number Chart.

  2. Fill in the following details:

    • Title: Total Web Searches.
    • Description: Total web search requests made by Claude.
    • Icon: Search.
    • Blueprint: claude_usage_record.
    • Chart type: Select Aggregate by property.
    • Property: web_search_requests.
    • Function: Sum.

  3. Click Save.

Token usage over time widget​

Token usage over time (click to expand)

  1. Click on + Widget and select Line Chart.

  2. Fill in the following details:

    • Title: Token Usage Over Time.
    • Description: Track input and output token consumption.
    • Icon: LineChart.
    • Blueprint: claude_usage_record.
    • Chart type: Select Aggregate by property.
    • Property: uncached_input_tokens, output_tokens.
    • Function: Sum.
    • Time interval: Week.
    • Time range: In the past 30 days.
    • Measure time by: record_date.

  3. Click Save.

Daily cost trends (click to expand)

  1. Click on + Widget and select Line Chart.

  2. Fill in the following details:

    • Title: Daily Cost Trends.
    • Description: Track API costs over time.
    • Icon: LineChart.
    • Blueprint: claude_cost_record.
    • Chart type: Select Aggregate by property.
    • Property: amount.
    • Function: Sum.
    • Time interval: Week.
    • Time range: In the past 30 days.
    • Measure time by: record_date.

  3. Click Save.

Model usage distribution widget​

Model usage distribution (click to expand)

  1. Click on + Widget and select Pie Chart.

  2. Fill in the following details:

    • Title: Model Usage Distribution.
    • Description: Which Claude models are being used most frequently.
    • Icon: Pie.
    • Blueprint: claude_model_usage.
    • Property: model.

  3. Click Save.

Tokens by model widget​

Tokens by model (click to expand)

  1. Click on + Widget and select Line Chart.

  2. Fill in the following details:

    • Title: Output Tokens by Model.
    • Description: Track token consumption per model over time.
    • Icon: LineChart.
    • Blueprint: claude_model_usage.
    • Chart type: Select Aggregate by property.
    • Property: output_tokens.
    • Function: Sum.
    • Time interval: Week.
    • Time range: In the past 30 days.
    • Measure time by: record_date.
    • Breakdown by: model.

  3. Click Save.

Claude Code activity widget​

Claude Code activity (click to expand)

  1. Click on + Widget and select Line Chart.

  2. Fill in the following details:

    • Title: Claude Code Activity.
    • Description: Track Claude Code sessions, commits, and PRs over time.
    • Icon: LineChart.
    • Blueprint: claude_code_analytics.
    • Chart type: Select Aggregate by property.
    • Property: num_sessions, commits, pull_requests.
    • Function: Sum.
    • Time interval: Week.
    • Time range: In the past 30 days.
    • Measure time by: record_date.

  3. Click Save.

Cache efficiency widget​

Cache efficiency (click to expand)

  1. Click on + Widget and select Line Chart.

  2. Fill in the following details:

    • Title: Cache Efficiency.
    • Description: Track cache read vs creation tokens for cost optimization.
    • Icon: LineChart.
    • Blueprint: claude_usage_record.
    • Chart type: Select Aggregate by property.
    • Property: cache_read_input_tokens, cache_creation_5m_tokens.
    • Function: Sum.
    • Time interval: Week.
    • Time range: In the past 30 days.
    • Measure time by: record_date.

  3. Click Save.