Grafana Dashboard for Claude Code AI Agent Observability (Mimir + Loki + Tempo)

claude-code-dashboard.json

{
  "annotations": {
    "list": []
  },
  "editable": true,
  "fiscalYearStartMonth": 0,
  "graphTooltip": 1,
  "links": [],
  "panels": [
    {
      "title": "Total Cost (USD)",
      "type": "stat",
      "gridPos": { "h": 6, "w": 4, "x": 0, "y": 0 },
      "datasource": { "type": "prometheus", "uid": "mCUDBhx4z" },
      "targets": [
        {
          "expr": "sum(claude_code_cost_usage_USD_total)",
          "legendFormat": "Total"
        }
      ],
      "fieldConfig": {
        "defaults": {
          "unit": "currencyUSD",
          "decimals": 2,
          "thresholds": {
            "mode": "absolute",
            "steps": [
              { "color": "green", "value": null },
              { "color": "yellow", "value": 10 },
              { "color": "red", "value": 100 }
            ]
          },
          "color": { "mode": "thresholds" }
        },
        "overrides": []
      },
      "options": {
        "reduceOptions": { "calcs": ["lastNotNull"] },
        "colorMode": "value",
        "graphMode": "none",
        "justifyMode": "auto",
        "textMode": "auto"
      }
    },
    {
      "title": "Active Sessions",
      "type": "stat",
      "gridPos": { "h": 6, "w": 4, "x": 4, "y": 0 },
      "datasource": { "type": "prometheus", "uid": "mCUDBhx4z" },
      "targets": [
        {
          "expr": "sum(claude_code_session_count_total)",
          "legendFormat": "Sessions"
        }
      ],
      "fieldConfig": {
        "defaults": {
          "thresholds": {
            "mode": "absolute",
            "steps": [
              { "color": "blue", "value": null }
            ]
          },
          "color": { "mode": "thresholds" }
        },
        "overrides": []
      },
      "options": {
        "reduceOptions": { "calcs": ["lastNotNull"] },
        "colorMode": "value",
        "graphMode": "none",
        "justifyMode": "auto",
        "textMode": "auto"
      }
    },
    {
      "title": "Total Tokens",
      "type": "stat",
      "gridPos": { "h": 6, "w": 4, "x": 8, "y": 0 },
      "datasource": { "type": "prometheus", "uid": "mCUDBhx4z" },
      "targets": [
        {
          "expr": "sum(claude_code_token_usage_tokens_total)",
          "legendFormat": "Tokens"
        }
      ],
      "fieldConfig": {
        "defaults": {
          "unit": "short",
          "thresholds": {
            "mode": "absolute",
            "steps": [
              { "color": "purple", "value": null }
            ]
          },
          "color": { "mode": "thresholds" }
        },
        "overrides": []
      },
      "options": {
        "reduceOptions": { "calcs": ["lastNotNull"] },
        "colorMode": "value",
        "graphMode": "none",
        "justifyMode": "auto",
        "textMode": "auto"
      }
    },
    {
      "title": "Cost Over Time",
      "type": "timeseries",
      "gridPos": { "h": 8, "w": 12, "x": 12, "y": 0 },
      "datasource": { "type": "prometheus", "uid": "mCUDBhx4z" },
      "targets": [
        {
          "expr": "sum by (model) (rate(claude_code_cost_usage_USD_total[5m]) * 300)",
          "legendFormat": "{{model}}"
        }
      ],
      "fieldConfig": {
        "defaults": {
          "unit": "currencyUSD",
          "custom": {
            "drawStyle": "line",
            "lineInterpolation": "smooth",
            "fillOpacity": 20,
            "gradientMode": "scheme",
            "stacking": { "mode": "normal" },
            "lineWidth": 2
          }
        },
        "overrides": []
      },
      "options": {
        "tooltip": { "mode": "multi", "sort": "desc" },
        "legend": { "displayMode": "table", "placement": "bottom", "calcs": ["sum"] }
      }
    },
    {
      "title": "Token Usage by Type",
      "type": "timeseries",
      "gridPos": { "h": 8, "w": 12, "x": 0, "y": 6 },
      "datasource": { "type": "prometheus", "uid": "mCUDBhx4z" },
      "targets": [
        {
          "expr": "sum by (type) (rate(claude_code_token_usage_tokens_total[5m]) * 300)",
          "legendFormat": "{{type}}"
        }
      ],
      "fieldConfig": {
        "defaults": {
          "unit": "short",
          "custom": {
            "drawStyle": "bars",
            "fillOpacity": 80,
            "gradientMode": "scheme",
            "stacking": { "mode": "normal" },
            "lineWidth": 0
          },
          "color": { "mode": "palette-classic" }
        },
        "overrides": []
      },
      "options": {
        "tooltip": { "mode": "multi", "sort": "desc" },
        "legend": { "displayMode": "table", "placement": "bottom", "calcs": ["sum"] }
      }
    },
    {
      "title": "Token Usage by Model",
      "type": "piechart",
      "gridPos": { "h": 8, "w": 6, "x": 12, "y": 8 },
      "datasource": { "type": "prometheus", "uid": "mCUDBhx4z" },
      "targets": [
        {
          "expr": "sum by (model) (claude_code_token_usage_tokens_total)",
          "legendFormat": "{{model}}",
          "instant": true
        }
      ],
      "fieldConfig": {
        "defaults": {
          "color": { "mode": "palette-classic" }
        },
        "overrides": []
      },
      "options": {
        "legend": { "displayMode": "table", "placement": "right", "values": ["value", "percent"] },
        "pieType": "donut",
        "reduceOptions": { "calcs": ["lastNotNull"] }
      }
    },
    {
      "title": "Cost by User",
      "type": "piechart",
      "gridPos": { "h": 8, "w": 6, "x": 18, "y": 8 },
      "datasource": { "type": "prometheus", "uid": "mCUDBhx4z" },
      "targets": [
        {
          "expr": "sum by (user_name) (claude_code_cost_usage_USD_total)",
          "legendFormat": "{{user_name}}",
          "instant": true
        }
      ],
      "fieldConfig": {
        "defaults": {
          "unit": "currencyUSD",
          "color": { "mode": "palette-classic" }
        },
        "overrides": []
      },
      "options": {
        "legend": { "displayMode": "table", "placement": "right", "values": ["value", "percent"] },
        "pieType": "donut",
        "reduceOptions": { "calcs": ["lastNotNull"] }
      }
    },
    {
      "title": "Sessions Over Time",
      "type": "timeseries",
      "gridPos": { "h": 8, "w": 12, "x": 0, "y": 14 },
      "datasource": { "type": "prometheus", "uid": "mCUDBhx4z" },
      "targets": [
        {
          "expr": "sum(increase(claude_code_session_count_total[1h]))",
          "legendFormat": "Sessions"
        }
      ],
      "fieldConfig": {
        "defaults": {
          "unit": "short",
          "custom": {
            "drawStyle": "bars",
            "fillOpacity": 60,
            "gradientMode": "scheme",
            "lineWidth": 0
          },
          "color": { "fixedColor": "blue", "mode": "fixed" }
        },
        "overrides": []
      },
      "options": {
        "tooltip": { "mode": "single" },
        "legend": { "displayMode": "hidden" }
      }
    },
    {
      "title": "Claude Code Events",
      "type": "logs",
      "gridPos": { "h": 10, "w": 24, "x": 0, "y": 22 },
      "datasource": { "type": "loki" },
      "targets": [
        {
          "expr": "{service_name=\"claude-code\"} | json",
          "refId": "A"
        }
      ],
      "options": {
        "showTime": true,
        "showLabels": true,
        "showCommonLabels": false,
        "wrapLogMessage": true,
        "prettifyLogMessage": true,
        "enableLogDetails": true,
        "sortOrder": "Descending",
        "dedupStrategy": "none"
      }
    },
    {
      "title": "API Errors",
      "type": "timeseries",
      "gridPos": { "h": 8, "w": 12, "x": 12, "y": 14 },
      "datasource": { "type": "loki" },
      "targets": [
        {
          "expr": "count_over_time({service_name=\"claude-code\"} | json | event_type=\"claude_code.api_error\" [5m])",
          "legendFormat": "Errors"
        }
      ],
      "fieldConfig": {
        "defaults": {
          "unit": "short",
          "custom": {
            "drawStyle": "bars",
            "fillOpacity": 80,
            "lineWidth": 0
          },
          "color": { "fixedColor": "red", "mode": "fixed" }
        },
        "overrides": []
      },
      "options": {
        "tooltip": { "mode": "single" },
        "legend": { "displayMode": "hidden" }
      }
    }
  ],
  "schemaVersion": 39,
  "tags": ["ai", "claude-code", "observability", "sre"],
  "templating": { "list": [] },
  "time": { "from": "now-24h", "to": "now" },
  "timepicker": {},
  "timezone": "browser",
  "title": "Claude Code - AI Agent Observability",
  "uid": "claude-code-observability",
  "version": 1
}