Registry

AI Components

High-quality animated UI components for AI apps—inspired directly by interfaces from OpenAI, Claude, Cursor, and more.

AI Components

Component demo

Claude composer input

Loading preview…

Claude composer input

Claude-style landing composer: rounded prompt surface, model menu with extended thinking, attachment trigger, voice control, and category chips.

Component demo

OpenAI image chat

Loading preview…

OpenAI image chat

OpenAI-style image composer: image vs. ask-anything modes, idea carousel, and attachment thumbnails for chat and tool UIs.

Component demo

OpenAI image loader

Loading preview…

OpenAI image loader

WebGL pixel-mosaic image generation loader with cycling status labels — monolith and compound APIs for AI SDK image flows.

Component demo

Claude map itinerary

Loading preview…

Claude map itinerary

Multi-day Leaflet itinerary with days, photos, and routing-style layout for trip planning tool output.

Component demo

Claude recipe tool

Loading preview…

Claude recipe tool

Rich recipe UI for AI chat: image carousel, servings scale, print, copy, inline timers, and unit conversion — styled for tool-rendered content.

Component demo

Claude text message tool

Loading preview…

Claude text message tool

Multi-variant SMS drafts with edit, copy, reset, and optional Open in Messages — for text message tool payloads.

Component demo

Claude email tool

Loading preview…

Claude email tool

Email draft UI with subject/body variants, Gmail and mailto actions, copy and reset — styled for email tool output.

Component demo

Claude image search tool

Loading preview…

Claude image search tool

Web image search results as a collage grid with lightbox carousel, domain badges, and favicons — for image_search-style tool output.

Component demo

OpenAI What's New dialog

Loading preview…

OpenAI What's New dialog

Multi-step onboarding-style dialog with hero imagery, captions, and next/finish flow — inspired by product update modals.

Component demo

Claude app recommendations

Loading preview…

Claude app recommendations

Install and download cards for Claude Desktop, mobile, Claude Code, and integrations — for recommend_claude_apps-style tool output.

Component demo

Cursor-style questions panel

Loading preview…

Cursor-style questions panel

Multi-question wizard with single- and multi-select, keyboard-friendly navigation, and optional other text — for in-app intake flows.

Marketing UI

Marketing UI

Code Block 1

Loading preview…

Code Block 1

Feature section with animated code block and syntax highlighting

Marketing UI

Code Block 2

Loading preview…

Code Block 2

Feature section with animated code block and syntax highlighting

Marketing UI

Code Block 3

Loading preview…

Code Block 3

Feature section with animated code block and syntax highlighting

Marketing UI

Feature Grid 1

Loading preview…

Feature Grid 1

Feature grid showcasing AI marketing agents with tilted card previews and hover effects. Perfect for highlighting product capabilities and use cases.

Marketing UI

Bento Layout 1

Loading preview…

Bento Layout 1

Comprehensive bento grid layout showcasing multiple installation and integration methods with animated visuals, interactive cards, and feature highlights.

Marketing UI

Model Comparison

Loading preview…

Model Comparison

Compare AI models like GPT-4, Claude, and Gemini. Includes filtering, sorting, performance metrics, and pricing data.

Marketing UI

Model Comparison Compact

Loading preview…

Model Comparison Compact

Compare AI models in a compact table format. Includes horizontal scrolling, sortable columns, and condensed data for quick evaluation.

Marketing UI

Model Comparison Hover

Loading preview…

Model Comparison Hover

Compare AI models with hover details for GPT-4, Claude, and Gemini. Includes filtering, sorting, and performance metrics.

Marketing UI

Comparison Table 1

Loading preview…

Comparison Table 1

Comprehensive comparison table showcasing leading AI models with detailed performance metrics, pricing analysis, and capability assessments. Features interactive filtering, sorting capabilities, and side-by-side comparisons for informed model selection and evaluation.

Marketing UI

Integration Showcase 1

Loading preview…

Integration Showcase 1

Dynamic integrations showcase featuring popular third-party services and APIs with seamless connection capabilities. Displays integration status, configuration options, and real-time connectivity testing for enhanced platform connectivity and workflow automation.

Marketing UI

AI Integrations Circle

Loading preview…

AI Integrations Circle

Circular fan-out layout showcasing AI integrations with radiating connection lines. Features interactive hover effects, tooltips, and dynamic positioning for visual integration highlights.

Marketing UI

Agent ROI Calculator

Loading preview…

Agent ROI Calculator

Advanced ROI calculator for AI agent implementations with interactive charts, cost-benefit analysis, and performance projections. Features dynamic input controls, real-time calculations, and comprehensive reporting for strategic decision-making and investment planning.

Marketing UI

Changelog 1

No preview loader for marketing-changelog-1-demo.

Changelog 1

Professional changelog interface with version history, feature highlights, and release notes. Features chronological organization, categorized updates, and interactive filtering for transparent product evolution tracking and user communication.