---
name: "@chamaac"
slug: "chamaac"
description: "A premium collection of high-performance animated and shader-driven components for React. Includes GLSL/WebGL shader backgrounds, React Three Fiber interactive scenes, and Framer Motion-animated elements. Components emphasize visual impact — particle effects, liquid shaders, scroll-triggered animations. Built with Tailwind CSS and Motion; copy-paste model. Free, MIT-licensed. Use for: adding GPU-accelerated shader backgrounds or cinematic scroll animations to a landing page or portfolio where visual differentiation matters."
category: "Animated components"
tags: ["3d", "aesthetic", "ai", "animation", "audio", "backgrounds", "blocks", "buttons", "cards", "e-commerce", "forms", "glassmorphism", "icons", "loaders", "maps", "marketing", "media", "navigation", "pro-available", "retro", "saas"]
framework: "react"
license: "MIT"
author: "amarnathdhumal"
website: "https://chamaac.com"
github: "https://github.com/amarnathdhumal/chamaacui"
registry: "https://chamaac.com/r/registry.json"
pro: true
pro_url: "https://chamaac.com/components/buttons/premium-button"
github_stars: 43
component_count: 90
generated_at: "2026-07-28T08:59:05.895Z"
---

# @chamaac

A premium collection of high-performance animated and shader-driven components for React. Includes GLSL/WebGL shader backgrounds, React Three Fiber interactive scenes, and Framer Motion-animated elements. Components emphasize visual impact — particle effects, liquid shaders, scroll-triggered animations. Built with Tailwind CSS and Motion; copy-paste model. Free, MIT-licensed. Use for: adding GPU-accelerated shader backgrounds or cinematic scroll animations to a landing page or portfolio where visual differentiation matters.

## Links

- Website: https://chamaac.com
- GitHub: https://github.com/amarnathdhumal/chamaacui
- Registry JSON: https://chamaac.com/r/registry.json
- Directory page: https://sh4dcn.vercel.app/registry/chamaac
- This file: https://sh4dcn.vercel.app/md/chamaac.md
- Pro / pricing: https://chamaac.com/components/buttons/premium-button

## Install

```sh
# add the whole registry (shadcn CLI)
npx shadcn@latest add https://chamaac.com/r/registry.json
pnpm dlx shadcn@latest add https://chamaac.com/r/registry.json
bunx shadcn@latest add https://chamaac.com/r/registry.json
# clone the source repo
git clone https://github.com/amarnathdhumal/chamaacui.git
# fetch the raw registry index
curl -s https://chamaac.com/r/registry.json
```

## Components (90)

| name | type | description | install |
| --- | --- | --- | --- |
| electric-mist | registry:component | A high-energy glowing lightning shader with waves and smoke effects. | `npx shadcn@latest add https://chamaac.com/r/electric-mist.json` |
| waves | registry:component | A smooth, shader-based wave animation component. | `npx shadcn@latest add https://chamaac.com/r/waves.json` |
| liquid-chrome | registry:component | A smooth, mesmerizing liquid metal shader effect. | `npx shadcn@latest add https://chamaac.com/r/liquid-chrome.json` |
| nebula | registry:component | A deep space nebula effect with fractional distortion. | `npx shadcn@latest add https://chamaac.com/r/nebula.json` |
| astral-flow | registry:component | A majestic, constantly breathing radial shader with deep cosmic wisps. | `npx shadcn@latest add https://chamaac.com/r/astral-flow.json` |
| synthesis | registry:component | A professional, multi-layered cosmic flow background with extensive warping customization. | `npx shadcn@latest add https://chamaac.com/r/synthesis.json` |
| light-speed | registry:component | A Warp/Light-Speed hyperspace animation inspired by the Ducky3D Blender tutorial. | `npx shadcn@latest add https://chamaac.com/r/light-speed.json` |
| stats-cards | registry:component | A set of animated statistic cards with hover effects. | `npx shadcn@latest add https://chamaac.com/r/stats-cards.json` |
| interactive-grid-background | registry:component | A highly interactive, mouse-sensitive grid background. | `npx shadcn@latest add https://chamaac.com/r/interactive-grid-background.json` |
| text-loop | registry:component | An animated text loop with typewriter and gradient effect. | `npx shadcn@latest add https://chamaac.com/r/text-loop.json` |
| gif-text | registry:component | A stunning text effect that uses a GIF as the fill color. | `npx shadcn@latest add https://chamaac.com/r/gif-text.json` |
| dancing-letters | registry:component | Physics-based interactive text animations with multiple animation styles. | `npx shadcn@latest add https://chamaac.com/r/dancing-letters.json` |
| premium-button | registry:component | An animated button with a dynamic arrow grid animation. | `npx shadcn@latest add https://chamaac.com/r/premium-button.json` |
| shimmer-button | registry:component | A button with a shimmer animation effect. | `npx shadcn@latest add https://chamaac.com/r/shimmer-button.json` |
| slideup-button | registry:component | A button with a smooth slide-up text animation on hover. | `npx shadcn@latest add https://chamaac.com/r/slideup-button.json` |
| hover-arrow-button | registry:component | A button with a smooth hover arrow swap animation. | `npx shadcn@latest add https://chamaac.com/r/hover-arrow-button.json` |
| focus-button | registry:component | A button with a focus ring animation effect. | `npx shadcn@latest add https://chamaac.com/r/focus-button.json` |
| neo-brutalist-button | registry:component | A bold, retro-styled button with skewed design, offset shadow, and shimmer effect. | `npx shadcn@latest add https://chamaac.com/r/neo-brutalist-button.json` |
| glowing-border-button | registry:component | A stylish button with a glowing border animation. | `npx shadcn@latest add https://chamaac.com/r/glowing-border-button.json` |
| gauge | registry:component | A customizable semi-circular gauge component for visualizing metrics and performance scores. | `npx shadcn@latest add https://chamaac.com/r/gauge.json` |
| carousel | registry:component | A smooth, auto-playing 3D carousel component with layout animations. | `npx shadcn@latest add https://chamaac.com/r/carousel.json` |
| feature-steps | registry:component | A dynamic feature showcase with auto-playing steps and synchronized image transitions. | `npx shadcn@latest add https://chamaac.com/r/feature-steps.json` |
| dock | registry:component | A navigation dock component with smooth animations and hover effects, perfect for desktop interfaces. | `npx shadcn@latest add https://chamaac.com/r/dock.json` |
| copy-icon | registry:component | An animated copy icon with smooth motion effects. | `npx shadcn@latest add https://chamaac.com/r/copy-icon.json` |
| wavy-icon | registry:component | An animated wavy icon with smooth motion effects. | `npx shadcn@latest add https://chamaac.com/r/wavy-icon.json` |
| adjustments-icon | registry:component | An animated adjustments/settings icon with smooth motion effects. | `npx shadcn@latest add https://chamaac.com/r/adjustments-icon.json` |
| ai-input | registry:component | A polished AI input component with model selection, tools, file uploads, and smooth animations. | `npx shadcn@latest add https://chamaac.com/r/ai-input.json` |
| scan-icon | registry:component | An animated scan icon with a moving scan line. | `npx shadcn@latest add https://chamaac.com/r/scan-icon.json` |
| bell-icon | registry:component | An animated bell icon that rings. | `npx shadcn@latest add https://chamaac.com/r/bell-icon.json` |
| settings-icon | registry:component | An animated settings icon that rotates. | `npx shadcn@latest add https://chamaac.com/r/settings-icon.json` |
| activity-icon | registry:component | An animated activity icon with a heartbeat line. | `npx shadcn@latest add https://chamaac.com/r/activity-icon.json` |
| refresh-icon | registry:component | An animated refresh icon that rotates. | `npx shadcn@latest add https://chamaac.com/r/refresh-icon.json` |
| wifi-icon | registry:component | An animated wifi icon with pulsing signal bars. | `npx shadcn@latest add https://chamaac.com/r/wifi-icon.json` |
| arrow-right-icon | registry:component | An animated arrow right icon that moves horizontally. | `npx shadcn@latest add https://chamaac.com/r/arrow-right-icon.json` |
| download-icon | registry:component | An animated download icon with a bouncing arrow. | `npx shadcn@latest add https://chamaac.com/r/download-icon.json` |
| globe-icon | registry:component | An animated globe icon that rotates continuously. | `npx shadcn@latest add https://chamaac.com/r/globe-icon.json` |
| star-icon | registry:component | An animated star icon that twinkles and rotates. | `npx shadcn@latest add https://chamaac.com/r/star-icon.json` |
| hourglass-icon | registry:component | An animated hourglass icon that rotates. | `npx shadcn@latest add https://chamaac.com/r/hourglass-icon.json` |
| lightbulb-icon | registry:component | An animated lightbulb icon with pulsing rays. | `npx shadcn@latest add https://chamaac.com/r/lightbulb-icon.json` |
| music-icon | registry:component | An animated music icon with dancing notes. | `npx shadcn@latest add https://chamaac.com/r/music-icon.json` |
| heart-icon | registry:component | An animated heart icon that beats. | `npx shadcn@latest add https://chamaac.com/r/heart-icon.json` |
| mail-icon | registry:component | An animated mail icon with a moving envelope flap. | `npx shadcn@latest add https://chamaac.com/r/mail-icon.json` |
| location-icon | registry:component | An animated location icon that rotates like a compass. | `npx shadcn@latest add https://chamaac.com/r/location-icon.json` |
| lock-icon | registry:component | An animated lock icon that locks and unlocks. | `npx shadcn@latest add https://chamaac.com/r/lock-icon.json` |
| rocket-icon | registry:component | An animated rocket icon with launch thrust animation. | `npx shadcn@latest add https://chamaac.com/r/rocket-icon.json` |
| zap-icon | registry:component | An animated zap icon with electric flash effect. | `npx shadcn@latest add https://chamaac.com/r/zap-icon.json` |
| eye-icon | registry:component | An animated eye icon with blinking and looking animation. | `npx shadcn@latest add https://chamaac.com/r/eye-icon.json` |
| send-icon | registry:component | An animated send icon with paper airplane flying motion. | `npx shadcn@latest add https://chamaac.com/r/send-icon.json` |
| volume-icon | registry:component | An animated volume icon with pulsing sound waves. | `npx shadcn@latest add https://chamaac.com/r/volume-icon.json` |
| check-icon | registry:component | An animated check icon with drawing circle and checkmark. | `npx shadcn@latest add https://chamaac.com/r/check-icon.json` |
| sparkle-icon | registry:component | An animated sparkle icon with twinkling stars. | `npx shadcn@latest add https://chamaac.com/r/sparkle-icon.json` |
| menu-icon | registry:component | An animated menu icon. | `npx shadcn@latest add https://chamaac.com/r/menu-icon.json` |
| alert-circle-icon | registry:component | An animated alert icon. | `npx shadcn@latest add https://chamaac.com/r/alert-circle-icon.json` |
| external-link-icon | registry:component | An animated external link icon. | `npx shadcn@latest add https://chamaac.com/r/external-link-icon.json` |
| cloud-icon | registry:component | An animated cloud icon. | `npx shadcn@latest add https://chamaac.com/r/cloud-icon.json` |
| credit-card-icon | registry:component | An animated credit card icon. | `npx shadcn@latest add https://chamaac.com/r/credit-card-icon.json` |
| cart-icon | registry:component | An animated cart icon. | `npx shadcn@latest add https://chamaac.com/r/cart-icon.json` |
| arrow-left-icon | registry:component | An animated arrow left icon. | `npx shadcn@latest add https://chamaac.com/r/arrow-left-icon.json` |
| arrow-up-icon | registry:component | An animated arrow up icon. | `npx shadcn@latest add https://chamaac.com/r/arrow-up-icon.json` |
| arrow-down-icon | registry:component | An animated arrow down icon. | `npx shadcn@latest add https://chamaac.com/r/arrow-down-icon.json` |
| arrow-up-right-icon | registry:component | An animated arrow up right icon. | `npx shadcn@latest add https://chamaac.com/r/arrow-up-right-icon.json` |
| arrow-up-left-icon | registry:component | An animated arrow up left icon. | `npx shadcn@latest add https://chamaac.com/r/arrow-up-left-icon.json` |
| arrow-down-left-icon | registry:component | An animated arrow down left icon. | `npx shadcn@latest add https://chamaac.com/r/arrow-down-left-icon.json` |
| arrow-down-right-icon | registry:component | An animated arrow down right icon. | `npx shadcn@latest add https://chamaac.com/r/arrow-down-right-icon.json` |
| chevron-right-icon | registry:component | An animated chevron right icon. | `npx shadcn@latest add https://chamaac.com/r/chevron-right-icon.json` |
| chevron-left-icon | registry:component | An animated chevron left icon. | `npx shadcn@latest add https://chamaac.com/r/chevron-left-icon.json` |
| chevron-up-icon | registry:component | An animated chevron up icon. | `npx shadcn@latest add https://chamaac.com/r/chevron-up-icon.json` |
| chevron-down-icon | registry:component | An animated chevron down icon. | `npx shadcn@latest add https://chamaac.com/r/chevron-down-icon.json` |
| chevrons-right-icon | registry:component | An animated chevrons right icon. | `npx shadcn@latest add https://chamaac.com/r/chevrons-right-icon.json` |
| chevrons-left-icon | registry:component | An animated chevrons left icon. | `npx shadcn@latest add https://chamaac.com/r/chevrons-left-icon.json` |
| chevrons-up-icon | registry:component | An animated chevrons up icon. | `npx shadcn@latest add https://chamaac.com/r/chevrons-up-icon.json` |
| chevrons-down-icon | registry:component | An animated chevrons down icon. | `npx shadcn@latest add https://chamaac.com/r/chevrons-down-icon.json` |
| calendar-icon | registry:component | An animated calendar icon. | `npx shadcn@latest add https://chamaac.com/r/calendar-icon.json` |
| shield-icon | registry:component | An animated shield icon. | `npx shadcn@latest add https://chamaac.com/r/shield-icon.json` |
| upload-icon | registry:component | An animated upload icon. | `npx shadcn@latest add https://chamaac.com/r/upload-icon.json` |
| message-icon | registry:component | An animated message icon. | `npx shadcn@latest add https://chamaac.com/r/message-icon.json` |
| search-icon | registry:component | An animated search icon. | `npx shadcn@latest add https://chamaac.com/r/search-icon.json` |
| close-icon | registry:component | An animated close icon. | `npx shadcn@latest add https://chamaac.com/r/close-icon.json` |
| clock-icon | registry:component | An animated clock icon. | `npx shadcn@latest add https://chamaac.com/r/clock-icon.json` |
| layers-icon | registry:component | An animated layers icon. | `npx shadcn@latest add https://chamaac.com/r/layers-icon.json` |
| moon-icon | registry:component | An animated moon icon. | `npx shadcn@latest add https://chamaac.com/r/moon-icon.json` |
| sun-icon | registry:component | An animated sun icon. | `npx shadcn@latest add https://chamaac.com/r/sun-icon.json` |
| trash-icon | registry:component | An animated trash icon. | `npx shadcn@latest add https://chamaac.com/r/trash-icon.json` |
| battery-icon | registry:component | An animated battery icon. | `npx shadcn@latest add https://chamaac.com/r/battery-icon.json` |
| gift-icon | registry:component | An animated gift icon. | `npx shadcn@latest add https://chamaac.com/r/gift-icon.json` |
| crown-icon | registry:component | An animated crown icon. | `npx shadcn@latest add https://chamaac.com/r/crown-icon.json` |
| thumbs-up-icon | registry:component | An animated thumbs up icon. | `npx shadcn@latest add https://chamaac.com/r/thumbs-up-icon.json` |
| how-it-works | registry:component | A visual flow component showing a step-by-step process with connected cards. | `npx shadcn@latest add https://chamaac.com/r/how-it-works.json` |
| water-caustic | registry:component | A stunning, tileable water caustic lighting shader using wave interference. | `npx shadcn@latest add https://chamaac.com/r/water-caustic.json` |
| grid-bloom | registry:component | A mesmerizing grid pattern with pulsing wave interference. | `npx shadcn@latest add https://chamaac.com/r/grid-bloom.json` |

## For AI agents

```text
You are adding components from @chamaac to a shadcn-compatible project.
1. Read this file (https://sh4dcn.vercel.app/md/chamaac.md) for the component list.
2. Fetch the machine-readable index: https://chamaac.com/r/registry.json
3. Install a single component with its install command from the table above.
4. Full structured record: https://sh4dcn.vercel.app/json (library slug: chamaac).
```