ChatGPT Model Selector: Draggable Web Component for AI Reasoning Tiers
ChatGPT Model Selector: a JavaScript library that renders a draggable, five-tier intelligence picker for AI chat interfaces. It ships as a zero-dependency Web Component alongside a matching SwiftUI package for iOS and ma
ChatGPT Model Selector: a JavaScript library that renders a draggable, five-tier intelligence picker for AI chat interfaces. It ships as a zero-dependency Web Component alongside a matching SwiftUI package for iOS and macOS.
Key features:
- Five-stop drag, click, and keyboard slider with magnetic snapping
- Animated blue-to-violet color fill with a Canvas sparkle stream
- Confetti celebration when a user reaches the Ultra tier
- Full reduced-motion support and a standard change event
- No dependencies, no build step, works with a single script tag
Useful for anyone building a model picker, settings panel, or AI composer UI that needs a fast-versus-smart tradeoff control.
π Blog Post
π GitHub Repo
π Live Demo
Originally published by Dev.to WebDev. Aggregated on AIWithGhost for educational purposes β full credit and traffic to the original publisher.