Components
drop in.
customize. ship.
Dotted World Map
A lightweight SVG world map made of dots, each tinted by a value. Drop it into analytics, hero sections, or anywhere you need a quiet global pulse.
Copy Command Block
A multi-package manager terminal command box with tab switcher (npm, pnpm, yarn, bun), persistent storage, copy feedback animation, and blueprint styling.
GitHub Heatmap
An interactive 52-week contribution activity graph with date-fns interval calculation, theme-aware level colors, and date tooltips.
Interactive Project Explorer
An IDE-style project explorer with collapsible year folders, status badges, and floating cursor image previews.
Fluid Carousel
Accessible touch-swipeable slide carousel with directional spring animations, keyboard arrow navigation, and pagination indicators.
Mode Toggler
A minimal Sun ↔ Moon theme toggle button built on next-themes. Supports an optional click sound, composable className, and dynamic aria-label.
Interactive Skill Cloud
A draggable physics pill cloud powered by matter.js — pills rain down, pile at the bottom, and collide; grab one and fling it.
Contact Channels
A hairline grid of contact cells with copy-to-clipboard actions, single-key shortcuts, tooltips, and blueprint hover styling.
Install with the shadcn CLI
Every component here is published as a registry item. Register @akoder once in your components.json, then install by name — the CLI handles files, dependencies, and registry dependencies.
"registries": {
"@akoder": "https://akoder.xyz/r/{name}.json"
}Or skip the setup and copy the direct npx shadcn add command on any component page.