Sound effects and music with Web Audio API synthesis
The Audio System provides retro-style sound effect generation using the Web Audio API. Create classic game sounds with square waves, sine waves, sawtooth, and noise using simple parameters.
Plays a sound effect with custom parameters or preset ID.
// Jump sound (rising pitch)
sfx({ wave: 'square', freq: 200, dur: 0.15, sweep: 800, vol: 0.3 });
// Laser shot (falling pitch)
sfx({ wave: 'sine', freq: 1000, dur: 0.3, sweep: -1500, vol: 0.4 });
// Explosion (noise)
sfx({ wave: 'noise', dur: 0.5, vol: 0.6 });
// Power-up (major chord sweep)
sfx({ wave: 'sine', freq: 440, dur: 0.4, sweep: 400, vol: 0.3 });Plays a pre-configured sound effect by ID.
| ID | Sound | Parameters |
|---|---|---|
| 0 | Blip/Menu | Square wave, 880 Hz, 0.1s |
| 1 | Coin/Pickup | Sine wave, 220 Hz → 120 Hz, 0.3s |
| 2 | Hit/Impact | Noise, 0.2s |
// Menu navigation
if (btnp(2)) {
menuIndex--;
sfx(0); // Blip sound
}
// Collect coin
if (collectedCoin) {
score += 10;
sfx(1); // Coin sound
}
// Take damage
if (hitByEnemy) {
health -= 10;
sfx(2); // Hit sound
}| Waveform | Sound Character | Best For |
|---|---|---|
| square | Hollow, retro, chip-tune | Blips, beeps, menu sounds, retro games |
| sine | Pure, smooth, musical | Lasers, power-ups, melodic effects |
| sawtooth | Buzzy, harsh, aggressive | Alarms, engines, intense action |
| noise | Static, explosion-like | Explosions, impacts, wind, crashes |
// Jump (8-bit platformer)
function playJumpSound() {
sfx({ wave: 'square', freq: 300, dur: 0.1, sweep: 600, vol: 0.25 });
}
// Laser shoot
function playLaserSound() {
sfx({ wave: 'sine', freq: 800, dur: 0.2, sweep: -1200, vol: 0.35 });
}
// Explosion
function playExplosionSound() {
sfx({ wave: 'noise', dur: 0.6, vol: 0.7 });
// Add bass rumble
sfx({ wave: 'sine', freq: 60, dur: 0.4, vol: 0.5 });
}
// Power-up collected
function playPowerUpSound() {
// Arpeggio effect
sfx({ wave: 'sine', freq: 523, dur: 0.08, vol: 0.3 }); // C
setTimeout(() => {
sfx({ wave: 'sine', freq: 659, dur: 0.08, vol: 0.3 }); // E
}, 80);
setTimeout(() => {
sfx({ wave: 'sine', freq: 784, dur: 0.15, vol: 0.3 }); // G
}, 160);
}
// Enemy hit
function playHitSound() {
sfx({ wave: 'noise', dur: 0.1, vol: 0.4 });
sfx({ wave: 'square', freq: 150, dur: 0.15, sweep: -100, vol: 0.3 });
}
// Menu select
function playMenuSelectSound() {
sfx({ wave: 'square', freq: 660, dur: 0.05, vol: 0.2 });
}
// Game over
function playGameOverSound() {
// Descending notes
const notes = [523, 494, 440, 392, 349];
notes.forEach((freq, i) => {
setTimeout(() => {
sfx({ wave: 'square', freq, dur: 0.25, vol: 0.3 });
}, i * 200);
});
}| Note | Frequency (Hz) | Use Case |
|---|---|---|
| C3 | 131 | Bass rumble |
| C4 (Middle C) | 262 | Low effects |
| A4 | 440 | Standard reference pitch |
| C5 | 523 | Medium effects |
| C6 | 1047 | High effects |
| C7 | 2093 | Very high, sharp sounds |