So I spent a weekend building one that fixes all four, and turned out to be a nice little engineering puzzle.

Live tool: learnmorsy.com/translator

What I actually wanted from it

I've been slowly picking up CW (Morse code on ham radio) and kept needing to check what a specific word sounds like at a target WPM speed. The workflow I wanted:

1. Type text.

2. Hear it played at any speed from 5 to 30 WPM.

3. Adjust the tone frequency (600 Hz is stancheap earbuds vs decent headphones).

DEV.to article body — hazır:

Every free Morse code translator I tried hadme had no audio at all. Some paywalled the playback. Some wouldn't let me set Farnswortould export the audio as a WAV file without a server round-trip.

So I spent a weekend building one that fixesbe a nice little engineering puzzle.

Live tool: learnmorsy.com/translator

What I actually wanted from it

I've been slowly picking up CW (Morse code on ham radio) and kept needing to check what a specific word sounds like at a target WPM speed. The workflow I wanted:

1. Type text.

2. Hear it played at any speed from 5 to 30

3. Adjust the tone frequency (600 Hz is standard but sounds different on cheap earbuds vs decent headphones).

4. Set Farnsworth spacing — independent character speed and text speed, the way real trainers teach it.

5. Download the audio as a WAV so I can drill it on a walk without opening the tool again.

• Astro static site

• Vanilla JavaScript for the translator itself, one file, no bundler

• Web Audio API for playback

• OfflineAudioContext + a small PCM 16-bit LE encoder for WAV export

• Tailwind 4 for the UI

• Cloudflare Pages for hosting

The translator script is under 500 lines and there's no framework. Turned out that was the right call — I ship changes with a single file edit and a cache-bust query param.

Timing model

Morse code is a timing system, not a symbol ured in "units":

• Dit: 1 unit ON

• Dah: 3 units ON

• Gap between symbols in a letter: 1 unit OFF

• Gap between letters: 3 units OFF

• Gap between words: 7 units OFF

The unit length is calibrated so the word PARIS takes 60/WPM seconds. That comes out to 1200 / WPM milliseconds per unit. So at 20 WPM, one unit is 60 ms. The full math is on the companion blog post if you want the whole story.

Once the timing rules are clear, the encoded Morse string is easy to schedule as audio.

The trick — unifying playback and WAV exp

Here's the part I got wrong on the first pasack first, using a Web Audio API oscillator that scheduled tones on the audio graph. Wor

Then I added WAV export. I wrote it with an OfflineAudioContext + a separate scheduler. Worked... almost.

The exported WAV had subtle off-by-one gaps ser preview didn't have. Different code paths, different timing bugs.

The fix was to unify the schedule generationconsumers read from:

function buildSchedule(pattern, timings) {
  const events = [];
  let t = 0.05; // small offset from t=0 so
  for (let i = 0; i < pattern.length; i++) {
    const ch = pattern[i];
    const next = pattern[i + 1];
    if (ch === '.' || ch === '-') {
      const dur = ch === '.' ? timings.dit : timings.dah;
      events.push({ t, dur });
      t += dur;
      // Only add intra-symbol gap if next char is another symbol
      // in the same letter. Space and slash overwrite the gap.
      if (next === '.' || next === '-') t += timings.intra;
    } else if (ch === ' ') {
      t += timings.letter;
    } else if (ch === '/') {
      t += timings.word;
    }
  }
  return { events, totalDur: t + 0.1 };
}

One schedule builder. Two consumers. Both realtime and offline reads the same list of {t, dur} events, so "play then download" produces the same audio down to th

Scheduling a tone

Same helper for both paths:

function scheduleToneOn(ctx, t, dur, freq) {
  const osc = ctx.createOscillator();
  const gain = ctx.createGain();
  osc.type = 'sine';
  osc.frequency.value = freq;
  const fade = Math.min(0.005, dur / 4);
  gain.gain.setValueAtTime(0, t);
  gain.gain.linearRampToValueAtTime(0.4, t +
produces audible clicks at the start and end of every dit. The linear ramp kills them.

## PCM 16-bit LE WAV encoder

OfflineAudioContext gives you an AudioBuffer once you call `startRendering()`. To download it, encode as WAV manually — no library needed, the RIFF header is small:

```js
function encodeWav(audioBuffer) {
  const numCh = 1;
  const sampleRate = audioBuffer.sampleRate;
  const samples = audioBuffer.getChannelData(0);
  const bytesPerSample = 2;
  const blockAlign = numCh * bytesPerSample;
  const byteRate = sampleRate * blockAlign;
  const dataSize = samples.length * bytesPerSample;
  const buffer = new ArrayBuffer(44 + dataSi
  const view = new DataView(buffer);

  writeString(view, 0, 'RIFF');
  view.setUint32(4, 36 + dataSize, true);
  writeString(view, 8, 'WAVE');
  writeString(view, 12, 'fmt ');

  view.setUint32(28, byteRate, true);
  view.setUint16(32, blockAlign, true);
  view.setUint16(34, 16, true);
  writeString(view, 36, 'data');
  view.setUint32(40, dataSize, true);

  let off = 44;
  for (let i = 0; i < samples.length; i++, off += 2) {
    const s = Math.max(-1, Math.min(1, samples[i]));
    view.setInt16(off, s < 0 ? s * 0x8000 : s * 0x7fff, true);
  }
  return buffer;
}

Wrap the returned ArrayBuffer in a `Blob({e an object URL, click a temporary anchor, and the browser saves the file. No server touched.

Farnsworth done as two sliders

Every free translator I saw either skipped Farnsworth or hid it in a menu. Real training needs two knobs:

• Character speed — how fast each letter sounds

• Text speed — the effective gap between letters

Beginners drill 20 WPM characters with 8 WPMshapes, but enough thinking room. That's howARRL and every serious trainer teaches it. Two sliders is the correct UI for this, not one.

In code, this changes the letter/word gap unit while keeping the intra-symbol dit unit at character speed:

const unit = 1.2 / wpm;                       // char speed
const gapUnit = 1.2 / Math.min(farnsWpm, wpm

Prosign parser — SOS the correct way

A prosign is a Morse pattern that doesn't spell a letter, it's a procedural signal. SOS is the most famous. On the air the proper SOS is one nine-symbol shape (...---...) with no letter gaps between the S, O, and S. Most Morse translators send SOS as three separate letters with 3-unit gaps in between, which is technically not a distress signal at all.

Fixed it with angle-bracket syntax. Type <SOS>, <AR>, <BT>, <SK>, <KN>, <VE>, <KA>, <HH> and each renders as one run-together shape:

function encode(input) {
  return input.toUpperCase().split(' ').map(
    const m = word.match(/^<([A-Z]+)>$/);
    if (m && PROSIGNS[m[1]]) return PROSIGNS
    return word.split('').map((ch) => TEXT_TO_MORSE[ch] ?? '').filter(Boolean).join(' ');
  }).filter(Boolean).join(' / ');
}

The decoder does the reverse — a token that matches a known prosign pattern with no internal spaces comes back as <XXX> in angle brackets, so a round-trip is lossless.

Puzzle share mode

Standard share links carry the plain text. Fine for showing a friend what a phrase looks like in Morse. Bad for setting a decoding challenge — the URL leaks the answer.

Puzzle share links carry only the Morse pattern in the URL, never the source text:

learnmorsy.com/translator/?puzzle=1&m=....%20.%20.-..%20.-..%20---

The recipient's browser detects puzzle=1, loads the pattern into a read-only main input, and shows a separate guess field with Check and Reveal buttons. Anyone poking at the URL can't spoil it.

Wrap up

Whole thing is under 500 lines of vanilla JS. No framework, no bundler, no backend. It runs offline once the page has loaded.

Try it: learnmorsy.com/translator

If you want the theory, the Morse timing math writeup covers why PARIS is the reference word and how Farnswor

There's a Koch-method Morse trainer app I'm shipping separately (iOS + Android + Apple Watch), but the translator is standalone and stays free. Feedback welcome, especially decoder edge cases I might have missed.