ComponentReactregistry:ui

AI Token Viewer

token-viewer

Token usage visualization with input/output/total counts, cost estimation for popular models, and interactive token breakdown with hover-to-inspect boundaries.

@elements Registry JSON

This item declares no source files.

Notes from the author

Compound component for visualizing token usage. Features input/output/total token counts, cost estimation for GPT-4/4o/3.5-turbo and Claude 3/3.5 models, visual token breakdown with color-coded types (text, special, control), hover tooltips showing token IDs and types.

Install

npx shadcn@latest add @elements/token-viewer

Needs @elements in your components.json registries — switch to URL if it doesn't resolve.

Registry: @elements
Kind: Component
Framework: React
Files: 0 · 10.6 KB
Preview: Unavailable

npm dependencies

lucide-react

This item belongs to @elements. Registry Index indexes and previews it; check the registry's license before use.