---
name: "@akoder"
slug: "akoder"
description: "Motion-rich React components and data visualizations — dotted world maps, GitHub activity maps, sliders, carousels, and terminal-style blocks built on Tailwind CSS v4 and Radix UI."
category: "Animated components"
tags: ["ai", "animation", "blocks", "buttons", "cards", "charts", "icons", "loaders", "maps", "media", "retro"]
framework: "react"
license: "MIT"
author: "AdityaKodez"
website: "https://akoder.xyz"
github: "https://github.com/AdityaKodez/adityaojha"
registry: "https://akoder.xyz/r/registry.json"
pro: false
pro_url: null
github_stars: 27
component_count: 16
generated_at: "2026-09-21T01:50:16.753Z"
---

# @akoder

Motion-rich React components and data visualizations — dotted world maps, GitHub activity maps, sliders, carousels, and terminal-style blocks built on Tailwind CSS v4 and Radix UI.

## Links

- Website: https://akoder.xyz
- GitHub: https://github.com/AdityaKodez/adityaojha
- Registry JSON: https://akoder.xyz/r/registry.json
- Directory page: https://sh4dcn.vercel.app/registry/akoder
- This file: https://sh4dcn.vercel.app/md/akoder.md

## Install

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

## Components (16)

| name | type | description | install |
| --- | --- | --- | --- |
| ask-ai | registry:ui | A popover prompt launcher with an animated mascot trigger, one-click query links for major AI providers, and instant clipboard fallback. | `npx shadcn@latest add https://akoder.xyz/r/ask-ai.json` |
| model-picker | registry:ui | A chat-style model switcher. Provider icons on a side rail filter the list to models available from that provider. | `npx shadcn@latest add https://akoder.xyz/r/model-picker.json` |
| command-palette | registry:ui | A keyboard-first ⌘K palette with grouped actions, drill-down pages, recent items, and directional motion, built on cmdk inside a self-contained dialog shell. | `npx shadcn@latest add https://akoder.xyz/r/command-palette.json` |
| dotted-world-map | registry:ui | A dependency-free SVG world map drawn with dots, tinted by heat value. Ships with interactive markers, tooltips, and a GitHub-style legend. | `npx shadcn@latest add https://akoder.xyz/r/dotted-world-map.json` |
| copy-command-block | registry:ui | A multi-package manager terminal command box with tab switcher (npm, pnpm, yarn, bun), persistent storage, copy feedback animation, and blueprint styling. | `npx shadcn@latest add https://akoder.xyz/r/copy-command-block.json` |
| github-map | registry:ui | An interactive 52-week contribution activity graph with date-fns interval calculation, theme-aware level colors, and date tooltips. | `npx shadcn@latest add https://akoder.xyz/r/github-map.json` |
| project-explorer | registry:ui | An IDE-style project showcase with collapsible year folders, status badges, and floating cursor image hover previews. | `npx shadcn@latest add https://akoder.xyz/r/project-explorer.json` |
| carousel | registry:ui | Accessible touch-swipeable slide carousel with directional spring animations, keyboard arrow navigation, and pagination indicators. | `npx shadcn@latest add https://akoder.xyz/r/carousel.json` |
| mode-toggler | registry:ui | A minimal Sun / Moon theme toggle button built on next-themes. Supports an optional click sound, composable className, and dynamic aria-label. | `npx shadcn@latest add https://akoder.xyz/r/mode-toggler.json` |
| interactive-skill-cloud | registry:ui | A draggable physics pill cloud powered by matter.js, pills rain down, pile at the bottom, and collide; grab one and fling it. | `npx shadcn@latest add https://akoder.xyz/r/interactive-skill-cloud.json` |
| contact-channels | registry:ui | A hairline grid of contact cells with copy-to-clipboard actions, single-key shortcuts, tooltips, and blueprint hover styling. | `npx shadcn@latest add https://akoder.xyz/r/contact-channels.json` |
| section-rail | registry:ui | A responsive section navigation rail with scroll tracking, smooth anchor jumps, link mode, and optional rich hover previews. | `npx shadcn@latest add https://akoder.xyz/r/section-rail.json` |
| progress-bars | registry:ui | A minimal textured bar chart with vertical and horizontal layouts, shipping a line fill and a dot matrix fill, driven by nothing more than a value per item. | `npx shadcn@latest add https://akoder.xyz/r/progress-bars.json` |
| workflow-status | registry:ui | Compact workflow badges with semantic defaults, custom states, icon and colour overrides, two sizes, and an icon-only form. | `npx shadcn@latest add https://akoder.xyz/r/workflow-status.json` |
| glyph-card | registry:ui | A hairline card whose background resolves into tiny plus marks on hover, gathering inside the glyph. Draws itself from a single SVG path on a 24x24 grid. | `npx shadcn@latest add https://akoder.xyz/r/glyph-card.json` |
| snake | registry:ui | A monochrome snake game on a dot-lattice field. Steer with the arrow keys, WASD, or a swipe, eat to grow by one segment, and wrap around the edges. | `npx shadcn@latest add https://akoder.xyz/r/snake.json` |

## For AI agents

```text
You are adding components from @akoder to a shadcn-compatible project.
1. Read this file (https://sh4dcn.vercel.app/md/akoder.md) for the component list.
2. Fetch the machine-readable index: https://akoder.xyz/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: akoder).
```