About
A 3D mechanical keyboard you can actually play with.
Built with React and Tailwind. Copy the prompt and paste it into Claude Code, Cursor or Lovable: your agent adds Mechanical Keyboard to your project and fits it to your theme.
Code
How Mechanical Keyboard is used: the demo's code. The component's own source comes with a free account.
Usage.tsx
"use client";
import { MechanicalKeyboard } from "@/components/ui/mechanical-keyboard";
export default function TestPage() {
return (
<main className="fixed inset-0 w-screen h-screen m-0 p-0 overflow-hidden bg-white dark:bg-[#08090b]">
<div className="w-full h-full relative">
<MechanicalKeyboard interactive typingInteraction />
</div>
</main>
);
}