skills.rest
mpsuesser
mpsuesserCOMMUNITY
Explore all skills by this author →
GitHub

tonejs

Build interactive browser audio with Tone.js synths, samplers, and Transport-synced sequencing.

Updated Mar 12, 2026
Search Tags:#typescript#sequencing#tonejs#web audio#audio effects#interactive music#transport timing
One-click install
npx skills add https://github.com/mpsuesser/workspace --skill tonejs-mpsuesser
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: tonejs
Source: https://github.com/mpsuesser/workspace/tree/main/dotconfig/pi/agent/skills/__techs__/tonejs
Command: npx skills add https://github.com/mpsuesser/workspace --skill tonejs-mpsuesser

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This Skill helps you build reliable, browser-based audio experiences with Tone.js by guiding correct initialization, musical timing, resource cleanup, and common implementation patterns.

Core Features & Use Cases

  • Synths, samplers, and players: Create instruments like Tone.Synth, Tone.PolySynth, Tone.Sampler, and Tone.Player to generate or play sound.
  • Transport-synced sequencing: Schedule rhythmically accurate events using Tone.getTransport(), Tone.Loop, Tone.Sequence, Tone.Part, and triggerAttackRelease(..., time).
  • Audio graphs and effects chains: Build Web Audio routing patterns and effect chains using .connect(), .chain(), and .toDestination(), including common effects such as Reverb, PingPongDelay, Filter, and Envelope components.
  • Developer safety rules for browser audio: Ensures you start audio from a user gesture via await Tone.start() and dispose nodes when they’re no longer needed.

Quick Start

Use this Skill to set up Tone.js in a TypeScript/JavaScript app and play a note by calling await Tone.start() from a user click handler, then creating an instrument and scheduling sound with Tone’s timing helpers.

Frequently Asked Questions about tonejs

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I start Web Audio playback safely from a user gesture in Tone.js?▼

To start Web Audio playback safely, call `await Tone.start()` within a user click handler to unlock the browser audio context before scheduling sound.

What is the best way to schedule deterministic musical events using Tone.js?▼

The best way to schedule deterministic musical events is using `Tone.getTransport()` with `Tone.Loop` or `Tone.Sequence` and passing `time` to `triggerAttackRelease`.

How do I build audio effect chains and route Web Audio graphs in Tone.js?▼

Build audio effect chains in Tone.js by connecting nodes like `Reverb` and `Filter` using `.connect()`, `.chain()`, and `.toDestination()` to route the audio graph.

Does Tone.js support TypeScript for building interactive browser music apps?▼

Yes, Tone.js supports TypeScript for building interactive browser music apps, allowing you to create synths, samplers, and Transport-synced sequences within a typed codebase.

Why should I use Tone.getTransport() instead of the global Transport object?▼

Use `Tone.getTransport()` instead of the deprecated global Transport object to ensure deterministic musical scheduling and proper timing-safe playback in your applications.

How do I manage resource cleanup for Web Audio nodes in Tone.js?▼

Manage Web Audio resource cleanup in Tone.js by calling `node.dispose()` on synths, samplers, and effects when they are no longer needed to free browser memory.

Related Skills

Explore More Software Engineering Skills→
plyghtplyght
2

tonejs

Automate browser-based audio application development with Tone.js.

Community
Advanced
daffy0208daffy0208
34

audio-producer

Develop custom web audio players with playback, recording, and waveform visualization.

Community
Intermediate
michsindlingermichsindlinger
1

State Management

Implements scalable state management patterns for React, Vue, and Angular applications.

Community
Advanced
PlayableIntelligencePlayableIntelligence
307

game-audio

Generate procedural BGM and SFX with the Web Audio API.

Official
Advanced