Open source on PluginUI

Maru UI Kit

Knobs, faders, keyboards, preset browsers and meters made to work with the Maru engine. Bound controls take their parameters, presets and MIDI straight from your module, so a face needs almost no glue code.

The components are released openly on PluginUI. Install the source, make it yours, and publish your own.

Start building Browse on PluginUI

Bound to the engine

Name the parameter. The host does the rest.

A face receives the module's host contract once. Each bound control then needs only a parameter path. Faces run in an embedded web view, so the same interface ships in the browser, the native app and DAW plugins.

Parameters: Bound knobs, faders and selects read range, taper, units and defaults from the module schema, send edits back to the host and follow its automation.
Presets: The preset selector and browser drive the host's preset library: factory, user and community sounds, tags and save.
MIDI: Keyboards play notes into the module, and CC strips map hardware controllers to parameters.
Signals: Meters, scopes and timelines draw what the host reports: levels, spectra and the transport position.

How module UI works →

my-face.tsx

import type { AudioModuleFaceProps } from "maruaudio/contracts"
import { ParameterProvider } from "maruaudio/ui/shared/parameter-binding"
import { ParameterKnob } from "@/components/ui/parameter-controls"

export function MyFace(face: AudioModuleFaceProps) {
  return (
    <ParameterProvider source={face}>
      <ParameterKnob path="filter.cutoff" />
    </ParameterProvider>
  )
}

Live demo

A whole front panel, composed from the kit

Drag a knob, hold Shift for a fine pass, double-click to reset it. The parameter line along the bottom is the panel's live state, as the engine would receive it.

Palette

Finish

Loading interactive preview…

Examples

Complete interfaces to start from

Every example on PluginUI is built from these same components. Install one, then bind its controls to your module.

Loading interactive preview…

Sculpted Console

Loading interactive preview…

Graphite Compressor

Loading interactive preview…

Obsidian Rack

Loading interactive preview…

See every example on PluginUI

Open source

Yours to build on

PluginUI is a shadcn registry. Each command copies the component's source into your project with its styles and dependencies, and you own it from then on. Restyle it, fork it, or release new controls of your own. We hope to see many more pieces published.

Visit PluginUI →Pitch a design →

$ pnpm dlx shadcn@latest add @pluginui/core-parameter-controls

$ pnpm dlx shadcn@latest add @pluginui/core-knob @pluginui/core-fader

Give your sound a face

Your controls are where a player meets the sound. Pair them with your instruments, effects, and presets to make a product that feels like yours.

Start building Read the docs