Pre-Release — API subject to change

ProControls for p5.js

by David Stein

An open source library of hardware-inspired UI controls for p5.js sketches — faders, rotary knobs, XY pads, step-sequencer grids, VU meters, LED displays, ADSR envelopes, menus, dialogs, and more. Built by David Stein and hosted at procontrols.org. Drop in one script tag, set a style, and your controls wire themselves up — no event handlers, no layout math, no boilerplate. Eight built-in themes (black, stainless, white, brushed, red, blue, yellow, dimpled) plus touch support out of the box.

ProControls.js p5.js 1.9+ MIT License ↗ Live Demo
Show us what you made

Built something cool with ProControls for p5.js? Send us a link and we'll highlight your project here.

learnProControls@gmail.com

Documentation Sections

Choose a section below to dive into the details of each control type.

Sliders & Dials

Vertical and horizontal faders, multi-touch sliders, range sliders, and rotary dials.

View documentation →

Pads

XY pads, grid pads, and a fully interactive piano keyboard with MIDI support.

View documentation →

Buttons

Icon buttons with customizable symbols and toggle states.

View documentation →

Selectors

Switches, dropdowns, tag selectors, and slider-based selectors for picking from lists.

View documentation →

Panels

Container panels, beveled frames, message dialogs, and input dialogs.

View documentation →

Menus

Context menus and popup menus with keyboard navigation and callbacks.

View documentation →

Displays

VU meters, LED displays, ADSR envelopes, graphs, heatmaps, and data views.

View documentation →

Themes & Styles

Eight built-in themes and guide to customizing colors and appearance.

View documentation →

Events

How ProControls hooks into p5.js events and touch input handling.

View documentation →