ModelBadge

A compact badge that displays the AI model name with an optional provider prefix.

openai/gpt-4o

anthropic/claude-3-5-sonnet

google/gemini-2.0-flash

import { ModelBadge } from "@aetherstack/ui"

Installation

terminal

npx aether-ui add model-badge

Import

import.tsx

import { ModelBadge } from "@aetherstack/ui"

Usage

modelbadge.tsx

<ModelBadge model="gpt-4o" provider="openai" />
<ModelBadge model="claude-3-5-sonnet" provider="anthropic" />

{/* Model name only */}
<ModelBadge model="gemini-2.0-flash" />

Props

Prop	Type	Default	Description
model*	string	—	Model name displayed in the badge.
provider	string	—	Provider name shown as a muted prefix before the model name.
className	string	—	Additional CSS classes.

* Required