Installation Agents Changelog TemplatesPRO

BG-01Dot FieldNew BG-02Background Paths BG-03Shape Hero BG-04Wind BG-05Topo BackgroundNew BG-06Drape BackgroundNew BG-07Halftone Background Rhythm HeroPRO Dither Reveal HeroPRO

CD-01Flick Card CD-02Throw Deck CD-03Now Playing CD-04Apple Activity Card CD-05Widget Grid CD-06Currency Transfer CD-07Momentum Rail CD-08Notification StackNew CD-09Liquid GaugeNew CD-10Activity TerrainNew CD-11Receipt PrinterNew CD-12Metric Card CD-13Uptime Card CD-14Spending Ring CD-15Lightbox GridNew Onboarding ChecklistPRO

NV-01Split Nav NV-02Tool Dock NV-03Swipe Tabs NV-04Account Menu NV-05Command Palette NV-06Smooth Drawer NV-07Marking MenuNew NV-08Scroll Index NV-09Status IslandNew NV-10Stack PanelNew

IN-01File Upload IN-02Avatar Picker IN-03Team Selector IN-04Loader IN-05Detent DialNew IN-06Wheel PickerNew IN-07Liquid SliderNew IN-08Signature PadNew Swatch FanPRO Price RangePRO

AI-01AI Input Selector AI-02AI Input Search AI-03AI State Loading AI-04AI Text Loading AI-05AI Voice AI-06AI Tool ApprovalNew AI-07AI Context MeterNew AI-08AI Inline CitationsNew AI-09AI Diff ReviewNew AI-10AI Model SelectorNew AI-11AI AutocompleteNew Slash Command MenuPRO Image Generation CardPRO

MD-01Clip TrimmerNew MD-02Synced TranscriptNew MD-03Focal Point PickerNew MD-04Photo StraightenNew Audio Player CardPRO

TX-01Typing Text TX-02Dynamic Text TX-03Glitch Text TX-04Extruded Text TX-05Plucked TextNew TX-06Cradle Text TX-07Spoiler TextNew Kinetic Type HeroPRO

BT-01Particle Button BT-02V0 Button BT-03Gradient Button BT-04Magnet Button BT-05Hold Button BT-06Command Button BT-07Switch Button BT-08Slide Text Button BT-09Pull CordNew BT-10Tear ButtonNew BT-11Bell ButtonNew BT-12Morph PopoverNew BT-13Undo ButtonNew Pay ButtonPRO

PROKokonut UI Pro100+ components to build websites faster, works with Claude Code, Cursor and more

PROInputs

Price Range

A two-handle price filter drawn over a histogram of the results, with a live count. Part of Kokonut UI Pro.

Swatch FanPRO

A color picker shaped like a paint fan deck. Drag it open, pick a hue and a shade, and copy the hex. Part of Kokonut UI Pro.

AI Input Selector

AI chat input with a model menu, a separate Effort control, file chips you can drop or paste, a / command menu, and Stop while replying.

On this page

No Headings

Agenta, a Kokonut UI Pro template

Kokonut UI ProBuild beautiful websites faster.

100+ components to build websites faster
Works with Claude Code, Cursor and more
One command installation with shadcn/cli

Explore Kokonut UI ProTrusted by 10k+ users worldwide