Audio And Sound

Handles everything audio in Phaser 4 games through the unified SoundManager API. You get WebAudio by default with HTML5 Audio fallback, covering playback, volume, looping, stereo panning, and spatial positioning. The fire-and-forget `this.sound.play()` is perfect for UI clicks and one-shots, while `this.sound.add()` gives you retained references for background music or interactive sounds you need to control. Audio sprites and markers let you pack multiple sounds into one file. Spatial audio works well for positional effects if you're on WebAudio. The manager auto-pauses on blur and handles mobile unlock requirements, which saves headaches. Good reference for the full sound lifecycle from preload to playback control.

skills.sh installs: 1.1K
GitHub stars: 40.7K
last updated: Aug 21, 2026

View on GitHub

Install

$ npx -y skills add phaserjs/phaser --skill audio-and-sound --agent claude-code

Installs into .claude/skills of the current project.

Files

Audio and Sound

Phaser provides a unified Sound system via this.sound (a SoundManager) that abstracts over Web Audio API and HTML5 Audio. It handles loading, playback, volume, panning, looping, markers, audio sprites, spatial audio, and browser autoplay-policy unlocking.

Key source paths: src/sound/BaseSoundManager.js, src/sound/BaseSound.js, src/sound/webaudio/, src/sound/html5/, src/sound/SoundManagerCreator.js, src/sound/events/, src/sound/typedefs/ Related skills: ../loading-assets/SKILL.md, ../game-setup-and-config/SKILL.md

Quick Start

class GameScene extends Phaser.Scene {
    preload() {
        this.load.audio('bgm', 'assets/music.mp3');
        this.load.audio('coin', ['assets/coin.ogg', 'assets/coin.mp3']);
    }

    create() {
        // Fire-and-forget (auto-destroys when complete)
        this.sound.play('coin');

        // Retained reference for ongoing control
        this.music = this.sound.add('bgm', { loop: true, volume: 0.5 });
        this.music.play();
    }
}

Assets loaded via this.load.audio() in preload() are ready by the time create() runs. Provide an array of URLs for cross-browser format fallback.

SKILL.md on GitHub