# AI Canvas

> AI Canvas is an open-core, shadcn-compatible registry of 86 animated React components, design systems, and templates built with Tailwind CSS and Motion. The free library is MIT, and Premium components, design systems, and templates are proprietary. Many components ship with a comprehensive AI remix prompt, so developers can install the code directly or recreate their own variation in any AI builder. On free components that prompt is public in full; on premium components and blocks only part of it is public (the setup and the constants), and the rest of the build spec requires a Premium subscription.

## Overview
- [Homepage](https://aicanvas.me): Browse all components.
- [All components](https://aicanvas.me/components): Full component list.
- [About](https://aicanvas.me/about): About AI Canvas.
- [Registry index](https://aicanvas.me/r/registry.json): Machine-readable registry index.

## Install
Install command: `npx shadcn@latest add @aicanvas/<component-name>`. The @aicanvas registry is listed in the official shadcn directory, so the CLI resolves it with no extra setup.

One-command installs require a free AI Canvas account. Signed out, the command still exits 0 but writes a small placeholder file titled "(free account required)" instead of the real component. Check for that title before reporting success. Premium components, templates, and the design-system installs marked Premium below additionally require a Premium subscription.

To authenticate installs: sign in and copy your personal token from https://aicanvas.me/account/settings, set it as AICANVAS_TOKEN in .env.local, and configure the registry once in the project's components.json:

```json
{ "registries": { "@aicanvas": { "url": "https://aicanvas.me/r/{name}.json", "params": { "token": "${AICANVAS_TOKEN}" } } } }
```

After that, every `npx shadcn@latest add @aicanvas/<component-name>` is authenticated. Alternatively, each component page shows a ready tokenized install command when signed in.

## MCP server
AI agents can browse and install AI Canvas components through the official MCP server, [@aicanvas/mcp on npm](https://www.npmjs.com/package/@aicanvas/mcp). Run it with `npx -y @aicanvas/mcp` (stdio transport). It exposes read-only tools: list_categories, list_components, search_components, get_component, get_install_command, list_systems, get_system, list_templates, get_template. Setup guide: https://aicanvas.me/mcp

## Design systems and templates
- [Andromeda Legacy](https://aicanvas.me/design-systems/andromeda): Design system (tokens + components). Browse free: https://aicanvas.me/design-systems/andromeda/system. Install (free account): `npx shadcn@latest add @aicanvas/andromeda-<component-name>` (one component, for example `andromeda-alert`; Button is `andromeda-button-system`), `npx shadcn@latest add @aicanvas/andromeda` (every component). Install (no account needed): `npx shadcn@latest add @aicanvas/andromeda-tokens` (foundation only: tokens, utilities, system icon). Install (Premium, requires an AI Canvas token): `npx shadcn@latest add @aicanvas/andromeda-all` (every component plus the templates).
  - [AI Brain](https://aicanvas.me/design-systems/andromeda/brain): Rule files an AI agent reads to build on-brand Andromeda Legacy UI (tokens, layout, motion, per-component rules). Install or update (Premium, requires an AI Canvas token): `npx shadcn@latest add --overwrite @aicanvas/andromeda-brain`
  - [Mission Control](https://aicanvas.me/design-systems/andromeda/templates/mission-control): Premium Dashboard template built entirely from Andromeda Legacy components. Install (Premium, requires an AI Canvas token): `npx shadcn@latest add @aicanvas/andromeda-mission-control`
  - [Service Order](https://aicanvas.me/design-systems/andromeda/templates/service-order): Premium CRM template built entirely from Andromeda Legacy components. Install (Premium, requires an AI Canvas token): `npx shadcn@latest add @aicanvas/andromeda-service-order`
  - [Resource Planning](https://aicanvas.me/design-systems/andromeda/templates/resource-planning): Premium Scheduling template built entirely from Andromeda Legacy components. Install (Premium, requires an AI Canvas token): `npx shadcn@latest add @aicanvas/andromeda-resource-planning`
  - [Signal Room](https://aicanvas.me/design-systems/andromeda/templates/signal-room): Premium Media template built entirely from Andromeda Legacy components. Install (Premium, requires an AI Canvas token): `npx shadcn@latest add @aicanvas/andromeda-signal-room`
- [Andromeda Pro](https://aicanvas.me/design-systems/andromeda-pro): Design system (tokens + components). Browse free: https://aicanvas.me/design-systems/andromeda-pro/components. Install (Premium, requires an AI Canvas token): `npx shadcn@latest add @aicanvas/andromeda-pro-<component-name>` (one component, for example `andromeda-pro-alert`), `npx shadcn@latest add @aicanvas/andromeda-pro-tokens` (foundation only: tokens, utilities, system icon), `npx shadcn@latest add @aicanvas/andromeda-pro` (every component), `npx shadcn@latest add @aicanvas/andromeda-pro-all` (every component plus the templates).
  - [AI Brain](https://aicanvas.me/design-systems/andromeda-pro/brain): Rule files an AI agent reads to build on-brand Andromeda Pro UI (tokens, layout, motion, per-component rules). Install or update (Premium, requires an AI Canvas token): `npx shadcn@latest add --overwrite @aicanvas/andromeda-pro-brain`
  - [City Operations](https://aicanvas.me/design-systems/andromeda-pro/templates/city-operations): Premium Dashboard template built entirely from Andromeda Pro components. Install (Premium, requires an AI Canvas token): `npx shadcn@latest add @aicanvas/andromeda-pro-city-operations`
  - [Signal Room](https://aicanvas.me/design-systems/andromeda-pro/templates/signal-room): Premium Media template built entirely from Andromeda Pro components. Install (Premium, requires an AI Canvas token): `npx shadcn@latest add @aicanvas/andromeda-pro-signal-room`
  - [Mission Control](https://aicanvas.me/design-systems/andromeda-pro/templates/mission-control): Premium Dashboard template built entirely from Andromeda Pro components. Install (Premium, requires an AI Canvas token): `npx shadcn@latest add @aicanvas/andromeda-pro-mission-control`
  - [Service Order](https://aicanvas.me/design-systems/andromeda-pro/templates/service-order): Premium CRM template built entirely from Andromeda Pro components. Install (Premium, requires an AI Canvas token): `npx shadcn@latest add @aicanvas/andromeda-pro-service-order`
  - [Resource Planning](https://aicanvas.me/design-systems/andromeda-pro/templates/resource-planning): Premium Scheduling template built entirely from Andromeda Pro components. Install (Premium, requires an AI Canvas token): `npx shadcn@latest add @aicanvas/andromeda-pro-resource-planning`
  - [Sign In](https://aicanvas.me/design-systems/andromeda-pro/templates/sign-in): Premium Authentication template built entirely from Andromeda Pro components. Install (Premium, requires an AI Canvas token): `npx shadcn@latest add @aicanvas/andromeda-pro-sign-in`

## Collections
- [Framer Motion Components for React](https://aicanvas.me/components/collection/framer-motion-components): Animated React components built with Motion (Framer Motion) and Tailwind CSS. Copy-paste ready, installable via the shadcn CLI.
- [Canvas Animation Components for React](https://aicanvas.me/components/collection/canvas-animation-components): React components that render animations on HTML canvas: particle fields, noise backgrounds, generative grids. Installable via the shadcn CLI.
- [React Particle Effect Components](https://aicanvas.me/components/collection/react-particle-effect-components): React particle effect components: constellations, magnetic dots, particle spheres, and bursts. Copy-paste ready, installable via the shadcn CLI.
- [React Widgets for SaaS Dashboards](https://aicanvas.me/components/collection/react-widgets-for-saas-dashboards): Animated React widgets for SaaS dashboards: progress, calendars, task cards, notifications, and user menus. Installable via the shadcn CLI.
- [React Components for AI Apps](https://aicanvas.me/components/collection/react-components-for-ai-apps): React components for AI products: chat composers, voice pills, AI job cards, and playful assistants. Installable via the shadcn CLI.
- [React Loading and Progress Components](https://aicanvas.me/components/collection/react-loading-and-progress-components): Animated React loading and progress components: upload progress, steppers, loaders, and charging indicators. Installable via the shadcn CLI.
- [React Date and Time Components](https://aicanvas.me/components/collection/react-date-and-time-components): Animated React date and time components: flip calendars, neon clocks, and scheduling cards. Installable via the shadcn CLI.
- [React Components for Ecommerce](https://aicanvas.me/components/collection/react-components-for-ecommerce): Animated React components for online stores: product card decks, cover-flow carousels, and swap widgets. Installable via the shadcn CLI.

## Components

## Backgrounds
- [Diamond Grid](https://aicanvas.me/components/diamond-grid): A faint canvas grid of diamonds. Seeded sparks send light outward until fronts meet. Install (free account): `npx shadcn@latest add @aicanvas/diamond-grid`. Registry: https://aicanvas.me/r/diamond-grid.json
- [Noise Field](https://aicanvas.me/components/noise-field): An animated flow field background. A grid of arrows driven by layered sine-wave noise drifts like wind. Hover and they turn to point at your cursor. Install (free account): `npx shadcn@latest add @aicanvas/noise-field`. Registry: https://aicanvas.me/r/noise-field.json
- [Spider Web](https://aicanvas.me/components/particle-constellation): An animated spider web background. Silk strands bow slowly at rest, and hovering pushes each node so it bounces back under tension. Install (free account): `npx shadcn@latest add @aicanvas/particle-constellation`. Registry: https://aicanvas.me/r/particle-constellation.json
- [Magnetic Logo Cluster](https://aicanvas.me/components/magnetic-logo-cluster): An interactive swarm of your logo. Marks fly in from off-screen, drift endlessly, and bend toward the cursor. Install (free account): `npx shadcn@latest add @aicanvas/magnetic-logo-cluster`. Registry: https://aicanvas.me/r/magnetic-logo-cluster.json
- [Magnetic Dots](https://aicanvas.me/components/magnetic-dots): An interactive dot background. A dense grid of dots is magnetically pulled toward your cursor, snapping back with an elastic bounce. Install (free account): `npx shadcn@latest add @aicanvas/magnetic-dots`. Registry: https://aicanvas.me/r/magnetic-dots.json
- [Wireframe Globe](https://aicanvas.me/components/sphere-lines): An animated wireframe globe background. A narrow wave band drifts slowly across the surface, and hovering ripples the lines under your cursor. Install (free account): `npx shadcn@latest add @aicanvas/sphere-lines`. Registry: https://aicanvas.me/r/sphere-lines.json
- [Particle Sphere](https://aicanvas.me/components/particle-sphere): A 3D particle background built with Three.js. 9,000 particles sit on a slowly spinning sphere in warm gold and cool silver. Install (free account): `npx shadcn@latest add @aicanvas/particle-sphere`. Registry: https://aicanvas.me/r/particle-sphere.json
- [Dot Grid](https://aicanvas.me/components/dot-grid): An animated dot grid background. Hovering lights up nearby dots with a smooth glow and an organic fade. Install (free account): `npx shadcn@latest add @aicanvas/dot-grid`. Registry: https://aicanvas.me/r/dot-grid.json
- [X Grid](https://aicanvas.me/components/x-grid): An animated X grid background. Marks illuminate and connect to their neighbors with constellation lines as your cursor passes. Install (free account): `npx shadcn@latest add @aicanvas/x-grid`. Registry: https://aicanvas.me/r/x-grid.json
- [Grain Background](https://aicanvas.me/components/noise-bg): A grain background of randomly scattered dots. Hover to illuminate them with a soft Gaussian glow and organic connection lines. Install (free account): `npx shadcn@latest add @aicanvas/noise-bg`. Registry: https://aicanvas.me/r/noise-bg.json
- [Bubble Field](https://aicanvas.me/components/bubble-field): An animated bubble background. A monochrome grid of outline circles bursts near the cursor, expanding and fading, then reforming. Install (free account): `npx shadcn@latest add @aicanvas/bubble-field`. Registry: https://aicanvas.me/r/bubble-field.json
- [Grid Lines](https://aicanvas.me/components/grid-lines): A grid background of dots connected by thin lines. The cursor lights a radial glow and bulges the grid outward like a lens as it moves. Install (free account): `npx shadcn@latest add @aicanvas/grid-lines`. Registry: https://aicanvas.me/r/grid-lines.json
- [Distortion Grid](https://aicanvas.me/components/distortion-grid): An animated grid background. Thin lines undulate in slow sweeping waves, and hovering repels the grid fabric outward from your cursor. Install (free account): `npx shadcn@latest add @aicanvas/distortion-grid`. Registry: https://aicanvas.me/r/distortion-grid.json
- [Wave Lines](https://aicanvas.me/components/wave-lines): An animated line background. Dense vertical lines ripple with two layered sine waves, bunching and breathing. Hover to send waves across the canvas. Install (free account): `npx shadcn@latest add @aicanvas/wave-lines`. Registry: https://aicanvas.me/r/wave-lines.json

## Blocks
- [Scroll Wipe Gallery](https://aicanvas.me/components/scroll-wipe-gallery): A full-bleed, scroll-driven photo gallery. Each photo wipes in from a different edge. Install (free account): `npx shadcn@latest add @aicanvas/scroll-wipe-gallery`. Registry: https://aicanvas.me/r/scroll-wipe-gallery.json
- [3D Gem Pricing Section](https://aicanvas.me/components/3d-gem-pricing-section): Three pricing cards, each topped by a still faceted gem that grows and spins on hover. Install (Premium, requires an AI Canvas token): `npx shadcn@latest add @aicanvas/3d-gem-pricing-section`. Registry: https://aicanvas.me/r/3d-gem-pricing-section.json
- [Curved Frame Carousel](https://aicanvas.me/components/curved-frame-carousel): A fixed frame masks a drifting photo deck. Drag it and panels hinge into 3D at the edge. Install (Premium, requires an AI Canvas token): `npx shadcn@latest add @aicanvas/curved-frame-carousel`. Registry: https://aicanvas.me/r/curved-frame-carousel.json
- [Perspective Showcase Hero](https://aicanvas.me/components/perspective-showcase-hero): A hero section pairing a split editorial header with an endless CSS 3D carousel, no WebGL: cards tilt continuously with distance from the centre so the row reads as one arc, images counter-zoom inside their frames, and one velocity loop drives drift, drag, wheel, and keyboard input. Fully configurable via typed props. Install (Premium, requires an AI Canvas token): `npx shadcn@latest add @aicanvas/perspective-showcase-hero`. Registry: https://aicanvas.me/r/perspective-showcase-hero.json
- [Fluid Simulation Hero](https://aicanvas.me/components/fluid-simulation-hero): A full bleed hero on a real time WebGL fluid simulation. The surface blooms into being on load, and the pointer stirs the dye. Install (Premium, requires an AI Canvas token): `npx shadcn@latest add @aicanvas/fluid-simulation-hero`. Registry: https://aicanvas.me/r/fluid-simulation-hero.json

## Navigation
- [Expanding Tabs](https://aicanvas.me/components/expanding-tabs): A monochrome tab bar of icon circles. Click one and it expands into a labeled pill. Install (free account): `npx shadcn@latest add @aicanvas/expanding-tabs`. Registry: https://aicanvas.me/r/expanding-tabs.json
- [Glass User Menu](https://aicanvas.me/components/glass-user-menu): Frosted glass user avatar trigger with animated dropdown, grouped menu items, and Log Out. Install (free account): `npx shadcn@latest add @aicanvas/glass-user-menu`. Registry: https://aicanvas.me/r/glass-user-menu.json
- [Glass Sidebar](https://aicanvas.me/components/glass-sidebar): Collapsible glassmorphism sidebar with icon-only and full label states, spring-animated expand and collapse. Install (free account): `npx shadcn@latest add @aicanvas/glass-sidebar`. Registry: https://aicanvas.me/r/glass-sidebar.json
- [Glass Dock](https://aicanvas.me/components/glass-dock): Glassmorphism macOS-style dock with cursor-proximity magnification. Icons scale with spring physics as the mouse approaches. Install (free account): `npx shadcn@latest add @aicanvas/glass-dock`. Registry: https://aicanvas.me/r/glass-dock.json
- [Glass Tab Bar](https://aicanvas.me/components/glass-tab-bar): Frosted glass pill tab bar with a sliding active indicator. Edge tabs snap flush to the container wall. Install (free account): `npx shadcn@latest add @aicanvas/glass-tab-bar`. Registry: https://aicanvas.me/r/glass-tab-bar.json
- [Glass Navbar](https://aicanvas.me/components/glass-navbar): Frosted glass navigation bar with animated active tab indicator, ambient color blobs, and spring-physics entrance. Install (free account): `npx shadcn@latest add @aicanvas/glass-navbar`. Registry: https://aicanvas.me/r/glass-navbar.json

## Buttons & Toggles
- [Delete Button](https://aicanvas.me/components/delete-button): A red button that starts a five-second delete countdown, with a one-tap undo. Install (free account): `npx shadcn@latest add @aicanvas/delete-button`. Registry: https://aicanvas.me/r/delete-button.json
- [Andromeda Button](https://aicanvas.me/components/andromeda-button): A sci-fi / blueprint-aesthetic button with five variants (default, outline, ghost, destructive, link), three sizes (small, medium, large), optional leading icon, and full hover / focus / active / disabled state coverage. Transparent hairline surfaces sit on a near-black canvas, with an electric-blue accent that brightens and glows on interaction. Install (free account): `npx shadcn@latest add @aicanvas/andromeda-button`. Registry: https://aicanvas.me/r/andromeda-button.json
- [Glass Toggle](https://aicanvas.me/components/glass-toggle): On/off toggles with glass housing and liquid-feel spring animation. Track color transitions smoothly. Install (free account): `npx shadcn@latest add @aicanvas/glass-toggle`. Registry: https://aicanvas.me/r/glass-toggle.json
- [Emoji Burst](https://aicanvas.me/components/emoji-burst): A button that explodes emojis outward in all directions. Five emoji sets cycle on each click. Install (free account): `npx shadcn@latest add @aicanvas/emoji-burst`. Registry: https://aicanvas.me/r/emoji-burst.json
- [Glitch Button](https://aicanvas.me/components/glitch-button): A terminal-inspired button with a text scramble glitch effect on hover. Install (free account): `npx shadcn@latest add @aicanvas/glitch-button`. Registry: https://aicanvas.me/r/glitch-button.json
- [Blind Pull Toggle](https://aicanvas.me/components/blind-pull-toggle): A dark/light mode toggle styled as a window-blind pull cord. Click to yank the cord and watch the icon swap through a venetian-blind slat animation. Install (free account): `npx shadcn@latest add @aicanvas/blind-pull-toggle`. Registry: https://aicanvas.me/r/blind-pull-toggle.json
- [Taga Toggle](https://aicanvas.me/components/taga-toggle): A playful pill toggle with an expressive face on the thumb: dead (×× eyes, flat mouth) when off, happy (arc eyes, big smile) when on. Track warms from grey to yellow. Install (free account): `npx shadcn@latest add @aicanvas/taga-toggle`. Registry: https://aicanvas.me/r/taga-toggle.json
- [Mark Toggle](https://aicanvas.me/components/mark-toggle): An iOS-style pill toggle in warm earth and sand tones: the thumb carries a small icon that morphs from X to checkmark as it slides across. Install (free account): `npx shadcn@latest add @aicanvas/mark-toggle`. Registry: https://aicanvas.me/r/mark-toggle.json
- [Pill Toggle](https://aicanvas.me/components/pill-toggle): A minimal iOS-style slider toggle: thumb glides between off (grey) and on (green) with a snappy spring. Fully responsive. Install (free account): `npx shadcn@latest add @aicanvas/pill-toggle`. Registry: https://aicanvas.me/r/pill-toggle.json

## Cards & Modals
- [Mood Tracker](https://aicanvas.me/components/mood-tracker): A feelings check-in card with six expressive faces. Drag the segmented slider and the face, label, and liquid color wash shift with your mood. Install (free account): `npx shadcn@latest add @aicanvas/mood-tracker`. Registry: https://aicanvas.me/r/mood-tracker.json
- [Product Card Deck](https://aicanvas.me/components/product-card-deck): A draggable card deck you flick through one card at a time. The top card leans toward your drag, then spins away with momentum to reveal the next, and the deck loops endlessly. Every card pairs a picture with a title and a pill action button with hover and press states. Install (free account): `npx shadcn@latest add @aicanvas/product-card-deck`. Registry: https://aicanvas.me/r/product-card-deck.json
- [Interactive Card Stack](https://aicanvas.me/components/interactive-card-stack): A scattered stack of photo cards. Drag, click, or arrow keys to focus any card. Install (free account): `npx shadcn@latest add @aicanvas/interactive-card-stack`. Registry: https://aicanvas.me/r/interactive-card-stack.json
- [Tilted Coverflow](https://aicanvas.me/components/tilted-coverflow): 3D coverflow card carousel of seven tilted photos. Drag or arrows to focus any card. Install (free account): `npx shadcn@latest add @aicanvas/tilted-coverflow`. Registry: https://aicanvas.me/r/tilted-coverflow.json
- [Live Session Pill](https://aicanvas.me/components/voice-chat-pill): A compact live-session presence pill with an animated speaking indicator and overlapping avatars. Clicks open a soft-UI modal showing all participants with a Join Now button. Install (free account): `npx shadcn@latest add @aicanvas/voice-chat-pill`. Registry: https://aicanvas.me/r/voice-chat-pill.json
- [New Project Modal](https://aicanvas.me/components/new-project-modal): A pill button that morphs into a soft-UI project creation form: title, description, 7-swatch color label picker, Private toggle, and a checkmark-confirm Create button. Install (free account): `npx shadcn@latest add @aicanvas/new-project-modal`. Registry: https://aicanvas.me/r/new-project-modal.json
- [Radial Cards](https://aicanvas.me/components/radial-cards): Seven health-metric cards bloom into a slowly rotating flower. Tap any petal to pull it forward and read your stats up close. Install (free account): `npx shadcn@latest add @aicanvas/radial-cards`. Registry: https://aicanvas.me/r/radial-cards.json
- [Peel to Scan](https://aicanvas.me/components/peel-corner-reveal): A portrait card whose corner peels on tap, revealing a scannable Wi-Fi QR code. Install (free account): `npx shadcn@latest add @aicanvas/peel-corner-reveal`. Registry: https://aicanvas.me/r/peel-corner-reveal.json
- [AI Job Cards](https://aicanvas.me/components/ai-job-cards): Three AI job card stacks with swipe-to-cycle. Brand logos, bookmark toggle, springs. Install (free account): `npx shadcn@latest add @aicanvas/ai-job-cards`. Registry: https://aicanvas.me/r/ai-job-cards.json
- [Label Cards](https://aicanvas.me/components/label-cards): Colour-blocked label cards scattered at random angles. Tap one to spring it to centre. Install (free account): `npx shadcn@latest add @aicanvas/label-cards`. Registry: https://aicanvas.me/r/label-cards.json
- [Slide Deck](https://aicanvas.me/components/slide-deck): Swipeable card deck with four editorial slides. Navigate forward and back by drag or tap. Install (free account): `npx shadcn@latest add @aicanvas/slide-deck`. Registry: https://aicanvas.me/r/slide-deck.json
- [Task Cards](https://aicanvas.me/components/task-cards): A swipeable project task card stack where each card has a unique accent colour, status badge, and due date. Drag left or right to cycle through tasks. The dismissed card springs back to the bottom of the deck. Install (free account): `npx shadcn@latest add @aicanvas/task-cards`. Registry: https://aicanvas.me/r/task-cards.json
- [Meet the Crew](https://aicanvas.me/components/meet-the-crew): A swipeable portrait card stack perfect for introducing a team, showcasing crew members, or picking an avatar. Four stacked cards fan out with soft rotations: drag to browse, tap to choose. Drop in your own photos and names for an About Us section, a character selector, or an onboarding profile picker. Install (free account): `npx shadcn@latest add @aicanvas/meet-the-crew`. Registry: https://aicanvas.me/r/meet-the-crew.json
- [Glass Modal](https://aicanvas.me/components/glass-modal): Centered dialog with deep glass blur, scale-spring entrance, and staggered content reveal. Install (free account): `npx shadcn@latest add @aicanvas/glass-modal`. Registry: https://aicanvas.me/r/glass-modal.json
- [Glass Card](https://aicanvas.me/components/glass-card): Glassmorphism content cards with 3D tilt-on-hover, spring physics, and a cursor-following glare highlight. Install (free account): `npx shadcn@latest add @aicanvas/glass-card`. Registry: https://aicanvas.me/r/glass-card.json
- [Polaroid Stack](https://aicanvas.me/components/polaroid-stack): Five polaroid photo cards stacked in a casual pile. Click to fan them out in a spring-animated arc, hover to lift, click a card to spotlight it. Install (free account): `npx shadcn@latest add @aicanvas/polaroid-stack`. Registry: https://aicanvas.me/r/polaroid-stack.json
- [Travel Deck](https://aicanvas.me/components/traveldeck): A swipeable deck of destination cards. Drag the front card down to fling it off-screen and reveal the next. Each card reveals an animated hotels counter as it comes forward. Install (free account): `npx shadcn@latest add @aicanvas/traveldeck`. Registry: https://aicanvas.me/r/traveldeck.json
- [3D Product Card](https://aicanvas.me/components/3d-product-card): An e-commerce product card with a real WebGL turntable. At rest it's a normal shop card (product, name, price, add-to-cart); hovering tilts the card into a 3D display floor while the product lifts and spins so shoppers can inspect it from any angle. Drag to orbit, pick a finish swatch to recolor the upholstery live, drop in your own .glb, adapts to light and dark themes. Install (Premium, requires an AI Canvas token): `npx shadcn@latest add @aicanvas/3d-product-card`. Registry: https://aicanvas.me/r/3d-product-card.json

## Widgets
- [Crypto Swap](https://aicanvas.me/components/crypto-swap): A crypto token-swap widget with live exchange rates, price impact, and an animated swap button. Install (free account): `npx shadcn@latest add @aicanvas/crypto-swap`. Registry: https://aicanvas.me/r/crypto-swap.json
- [Signature Pad](https://aicanvas.me/components/signature-pad): A signature pad widget: pill button morphs into a canvas to draw with mouse or touch. Install (free account): `npx shadcn@latest add @aicanvas/signature-pad`. Registry: https://aicanvas.me/r/signature-pad.json
- [Upload Progress](https://aicanvas.me/components/upload-progress): A collapsible file upload widget with a shimmer progress bar (indigo while uploading, amber on pause). Expand to see per-file rows with live progress, time remaining, and pause, resume, refresh, and stop controls. Install (free account): `npx shadcn@latest add @aicanvas/upload-progress`. Registry: https://aicanvas.me/r/upload-progress.json
- [Emoji Reaction Jar](https://aicanvas.me/components/jar-of-emotions): Glass jar widget. Click a reaction to spring the lid and watch the emoji bounce down. Install (free account): `npx shadcn@latest add @aicanvas/jar-of-emotions`. Registry: https://aicanvas.me/r/jar-of-emotions.json
- [Sticker Wall](https://aicanvas.me/components/sticker-wall): A draggable sticker card wall. Drop notes, toss emoji, pile them up with real 2D physics. Install (free account): `npx shadcn@latest add @aicanvas/sticker-wall`. Registry: https://aicanvas.me/r/sticker-wall.json
- [Danger Stripes](https://aicanvas.me/components/danger-stripes): Three crossing caution-tape stripes on orange. Hover to shake, click to intensify. Install (free account): `npx shadcn@latest add @aicanvas/danger-stripes`. Registry: https://aicanvas.me/r/danger-stripes.json
- [Glass Progress](https://aicanvas.me/components/glass-progress): Glassmorphism progress bar panel with glowing gradient fills, spring-animated counters, staggered reveal, and replay button. Install (free account): `npx shadcn@latest add @aicanvas/glass-progress`. Registry: https://aicanvas.me/r/glass-progress.json
- [Glass Music Player](https://aicanvas.me/components/glass-music-player): Mini music player with glass surface, spinning vinyl art, animated progress bar, and ambient glow. Install (free account): `npx shadcn@latest add @aicanvas/glass-music-player`. Registry: https://aicanvas.me/r/glass-music-player.json
- [Seven-Segment Clock](https://aicanvas.me/components/neon-clock): A retro 7-segment LCD clock with pixel-grid overlay. Shows live HH:MM:SS with blinking colon, AM/PM indicator, day of week row, and full date. Install (free account): `npx shadcn@latest add @aicanvas/neon-clock`. Registry: https://aicanvas.me/r/neon-clock.json
- [Flip Calendar](https://aicanvas.me/components/flip-calendar): A desk-calendar widget showing dates 1–31 with a satisfying flip-clock page-turn animation. Install (free account): `npx shadcn@latest add @aicanvas/flip-calendar`. Registry: https://aicanvas.me/r/flip-calendar.json
- [Runway Loader](https://aicanvas.me/components/runway-loader): An airplane taxis down a runway progress bar, nose tilting up and taking off at 100%. Install (free account): `npx shadcn@latest add @aicanvas/runway-loader`. Registry: https://aicanvas.me/r/runway-loader.json
- [Charging Widget](https://aicanvas.me/components/charging-widget): Circular battery indicator with animated liquid waves that rise as the percentage counts up, looping continuously. Install (free account): `npx shadcn@latest add @aicanvas/charging-widget`. Registry: https://aicanvas.me/r/charging-widget.json

## 3D & Shaders
- [Cube Carousel](https://aicanvas.me/components/cube-carousel): An interactive 3D photo cube with six placeholder images on its faces. Drag with your cursor to spin it freely on both axes; release and it coasts naturally to a stop. No buttons, no snap, no controls, just the cube and your hand. Install (free account): `npx shadcn@latest add @aicanvas/cube-carousel`. Registry: https://aicanvas.me/r/cube-carousel.json
- [Curious AI](https://aicanvas.me/components/curious-ai): A morphing 3D AI orb in Three.js with cyan and magenta rim lights, iridescent pink speckles on a wrinkled surface, and glowing pink robot-eye pills that follow your cursor and blink between idle looks. Install (free account): `npx shadcn@latest add @aicanvas/curious-ai`. Registry: https://aicanvas.me/r/curious-ai.json

## Typography
- [Ripple Type](https://aicanvas.me/components/ripple-type): SVG text animation warped by a turbulence filter. Toggle the fan and letters ripple. Install (free account): `npx shadcn@latest add @aicanvas/ripple-type`. Registry: https://aicanvas.me/r/ripple-type.json
- [Stack Tower](https://aicanvas.me/components/stack-tower): A column of 12 stacked words that reads as a rotating 3D cylinder. 2D transforms skew, scale and shift each row so the rotation travels down the stack. Hover lights one row in warm orange without breaking the rhythm. Install (free account): `npx shadcn@latest add @aicanvas/stack-tower`. Registry: https://aicanvas.me/r/stack-tower.json
- [Slice Type](https://aicanvas.me/components/slice-type): A typographic magic trick. At rest you read one ambiguous word; hover and it splits into two: LIGHT lifting up, NIGHT sinking down, the shared letters resolving into separate glyphs. Install (free account): `npx shadcn@latest add @aicanvas/slice-type`. Registry: https://aicanvas.me/r/slice-type.json
- [Halo Type](https://aicanvas.me/components/halo-type): Rotating 3D ring text animation: the front arc reads upright, the back arc upside-down. Install (free account): `npx shadcn@latest add @aicanvas/halo-type`. Registry: https://aicanvas.me/r/halo-type.json
- [Orbit](https://aicanvas.me/components/orbit): Kinetic text animation arranged in a circle. Hover slows the spin; letters push outward. Install (free account): `npx shadcn@latest add @aicanvas/orbit`. Registry: https://aicanvas.me/r/orbit.json
- [Wild Morph](https://aicanvas.me/components/wild-morph): Italic SVG word that warps under the cursor, a spring-physics text animation. Install (free account): `npx shadcn@latest add @aicanvas/wild-morph`. Registry: https://aicanvas.me/r/wild-morph.json
- [Playful](https://aicanvas.me/components/playful): Kinetic typography where letters jump, drop, and rotate on cursor proximity. Install (free account): `npx shadcn@latest add @aicanvas/playful`. Registry: https://aicanvas.me/r/playful.json
- [Good Vibes](https://aicanvas.me/components/good-vibes): Interactive typography where letters scale 2x and become bold on hover. Install (free account): `npx shadcn@latest add @aicanvas/good-vibes`. Registry: https://aicanvas.me/r/good-vibes.json
- [Responsive Letters](https://aicanvas.me/components/responsive-letters): Interactive text where each letter responds to cursor proximity, animating variable font properties (weight, stretch, italic, letter-spacing, skew) to create a deformation-under-pressure effect. Install (free account): `npx shadcn@latest add @aicanvas/responsive-letters`. Registry: https://aicanvas.me/r/responsive-letters.json
- [Scramble Text](https://aicanvas.me/components/scramble-text): Two words scramble continuously in a pixel cipher. Hover the container to decrypt them one by one. Mouse out and they snap back to noise. Install (free account): `npx shadcn@latest add @aicanvas/scramble-text`. Registry: https://aicanvas.me/r/scramble-text.json
- [Text Blur Reveal](https://aicanvas.me/components/text-blur-reveal): Words animate into view one by one with a satisfying blur-to-sharp entrance, auto-replaying in a loop. Install (free account): `npx shadcn@latest add @aicanvas/text-blur-reveal`. Registry: https://aicanvas.me/r/text-blur-reveal.json

## Inputs & Controls
- [Glass AI Composer](https://aicanvas.me/components/glass-ai-compose): Glassmorphism AI chat input with image upload, web search toggle, and model switcher. Install (free account): `npx shadcn@latest add @aicanvas/glass-ai-compose`. Registry: https://aicanvas.me/r/glass-ai-compose.json
- [Glass Stepper](https://aicanvas.me/components/glass-stepper): Glassmorphism numeric stepper with spring number flip, notification-style tinted buttons, and configurable min/max/step. Install (free account): `npx shadcn@latest add @aicanvas/glass-stepper`. Registry: https://aicanvas.me/r/glass-stepper.json
- [Glass Search Bar](https://aicanvas.me/components/glass-search-bar): Glassmorphism search bar with animated suggestion dropdown, active state glow, and reduced-motion support. Install (free account): `npx shadcn@latest add @aicanvas/glass-search-bar`. Registry: https://aicanvas.me/r/glass-search-bar.json
- [Glass Slider](https://aicanvas.me/components/glass-slider): Range sliders with glass tracks, glowing colored fills, and spring-animated thumbs that scale on drag. Install (free account): `npx shadcn@latest add @aicanvas/glass-slider`. Registry: https://aicanvas.me/r/glass-slider.json
- [Radial Toolbar](https://aicanvas.me/components/radial-toolbar): A radial context menu that fans out formatting tools around a centre button, with active toggle states and an animated label pill. Install (free account): `npx shadcn@latest add @aicanvas/radial-toolbar`. Registry: https://aicanvas.me/r/radial-toolbar.json
- [Filter Menu](https://aicanvas.me/components/filter-menu): A skeuomorphic pill that expands into a multi-select filter checklist with Apply. Install (Premium, requires an AI Canvas token): `npx shadcn@latest add @aicanvas/filter-menu`. Registry: https://aicanvas.me/r/filter-menu.json

## Notifications
- [Glass Toast](https://aicanvas.me/components/glass-toast): Frosted glassmorphism toast notification stack with 4 variants, auto-dismiss progress bar, and spring-animated stacking. Install (free account): `npx shadcn@latest add @aicanvas/glass-toast`. Registry: https://aicanvas.me/r/glass-toast.json
- [Glass Notifications](https://aicanvas.me/components/glass-notification): Swipe-to-dismiss notification stack with glass cards and spring-animated layout transitions. Install (free account): `npx shadcn@latest add @aicanvas/glass-notification`. Registry: https://aicanvas.me/r/glass-notification.json
- [Glass Tags](https://aicanvas.me/components/glass-tags): Selectable pill-shaped tags with glass surfaces, unique color accents, and spring-animated check marks. Install (free account): `npx shadcn@latest add @aicanvas/glass-tags`. Registry: https://aicanvas.me/r/glass-tags.json