Model selectors for AI apps
Live model catalogs. Validated provider settings.
Install the model tools. Copy the
interface.
Selector examples
Model only
Just the model. Search by name and pick from your available catalog.
Standalone composer
A compact model control with its settings in one menu.
Chat composer
Write a prompt. Set the model and its options in one place.
Local draft · Copy the prompt and selection when ready
Inspector
Explore the catalog with model details, listed prices, and source evidence.
Your selection
Changes here follow you across all four examples.
JSON
Choose a model or option to inspect the value.
Model tools
SvelteKit starter · JavaScript starter · AI SDK example
One package, @axelrock/models. Import the parts you need. The UI stays in
your codebase.
@axelrock/models/core- Types, policies, options, and pricing.
@axelrock/models/providers- Live catalogs and provider-specific mappings.
@axelrock/models/ai-sdk- Optional AI SDK integration.
Install once, then use the imports above:
npm install @axelrock/models
Copy the UI source folder into your
TypeScript app. It imports @axelrock/models/core, so provider updates do
not replace your UI customizations.
Package example ↗
Standalone example
For a quick start without packages, save both files together and serve them locally.
Providers
OpenRouter and Vercel AI Gateway offer public live catalogs. OpenAI, Anthropic, and Google AI require server-side credentials.
Keep keys on your server. Models handles selection; your app sends the requests.
Provider & model icons
46 brand marks. Choose a style, then click an icon to copy its SVG.
Loading icons…
Choose an icon to copy its SVG.
Icon coverage does not imply an adapter integration. Brand artwork from LobeHub. Licenses and attribution ↗