Morse Telegraph
A brass telegraph key: tap dits and dahs, watch them print on paper tape and decode live.
- Zero dependencies
- React + Tailwind
- Accessible
- Reduced-motion aware
Preview
Animated · Full motion: idle animation, physics and effects. animated (default)
Short press = dit, long = dah, pauses separate letters and words. A sounder beeps, the paper tape records every mark, and a decoder turns them into text. Or type a message and transmit it.
Installation
$ npx shadcn@latest add https://guetix.com/r/morse-telegraph.json
Uses the shadcn CLI. It creates components/guetix/morse-telegraph.tsx and installs nothing else.
Usage
example.tsx
import { MorseTelegraph } from "@/components/guetix/morse-telegraph";
export default function Example() {
return <MorseTelegraph />;
}
Props
| Prop | Type | Default | Description |
|---|---|---|---|
| dah | number | 180 | Dit/dah threshold (ms). |
| tone | number | 640 | Tone frequency (Hz). |
| sound | boolean | true | Beep. |
| animated | boolean | true | false = the calm “Regular” version (no idle or ambient motion). |
Accessibility
- Space works as the key; decoded text is a live region.