Robot Keyboard

An animated SVG mechanical keyboard illustration with sculpted keycaps, a matrix scan readout, and compact/extended/split layouts that types a scripted keystroke passage or responds to drag and keyboard scrubbing.

Built with React and Tailwind. Copy the prompt and paste it into Claude Code, Cursor or Lovable: your agent adds Robot Keyboard to your project and fits it to your theme.

"use client";

import { RobotKeyboard } from "@/components/ui/robot-keyboard";

export default function RobotKeyboardDemo() {
  return (
    <div className="flex min-h-[500px] w-full items-center justify-center bg-background p-10">
      <RobotKeyboard layout="compact" behavior="type" />
    </div>
  );
}