# Mixer

The desk the decks plug into, made of the kit's own materials. Any number of channels (two by default, up to eight), each with a trim, three-band EQ, a colour filter, a crossfader side, a cue key and a fader beside its LED ladder; master and booth levels, a crossfader with three curves, a small screen, and a back panel with the line ins and the master out.

Object · With a Pass · https://tactileui.dev/objects/mixer

> The code and styling for this object come with the Pass. Sign in if you have one. Sign in: https://tactileui.dev/auth/sign-in The price: https://tactileui.dev/pricing

## Use it

With a Pass, install it with npx shadcn add @tactile/mixer (https://tactileui.dev/docs/registry-and-mcp). It lands in tactile/mixer/, with what it is built with beside it.

Load the stylesheet as well as the module, or it renders unstyled: tactile/deck/deck.css and tactile/mixer/mixer.css. In a bundler such as Vite, import each CSS file next to the module import; in plain HTML, link it.

Then new Mixer(element, options) from tactile/mixer/mixer.mjs. Every option has a default; example.html in the folder shows it running. The sample copy (headings, labels, figures) is placeholder: replace it with the page's own.

## Anatomy

N channel strips from one function, Three band eq and colour filter, Audio taper faders, Crossfader curves, Meters from the same gains, Declared channel routing, Two faced 3d flip, Container query layout

## Usage notes

The mixing half of a booth, or an audio app that wants a real console: a music tool, a streaming control room, a podcast desk, a game's sound menu. Decks plug into its channels and say which one they feed; the sound, the meters and the printed numbers all come from the same gains. Make it four channels and a third and fourth deck can plug in.

## Options

| Option | Type | Description |
| - | - | - |
| channels | number | How many channel strips: one to eight. Each has its own trim, EQ, filter, cue and fader, and its own line in on the back. |
| curve | enum | Smooth keeps the level even through the blend; linear dips in the middle; cut keeps both full until the last few millimetres, for scratching. |
| side | enum | The front panel, or the back with the inputs and the master out. The mixer turns over. |
| name | text | Printed on the mixer and read out by a screen reader. |
| label | text | Empty reads the name and the channel count. |

## Methods

- channels
- attach
- detach
- target
- otherSource
- feeders
- update
- flip
- setCrossfader
- strip
- destroy

## States

1. **Channel strips**: Trim, high, mid and low, and a colour filter that closes a low-pass from the left and a high-pass from the right; each knob clicks at the middle, turns by drag, wheel or keys and speaks its value.
2. **Faders and ladders**: A channel fader on an audio taper beside its own LED ladder; the ladders rise at once and fall over about a third of a second.
3. **Crossfader**: A side switch on every channel (A, thru, B) and a crossfader with a smooth, linear or cut curve; the screen and the speech say how much of each side passes.
4. **Cue and listen**: A cue key per channel and a Listen to switch: master, or the cued channels before their faders.
5. **Master and booth**: 
6. **Screen**: Each channel's source and tempo with a bar for what it sends to the master, the master level, and the last control touched.
7. **Channels**: The channels option draws that many strips and line-in sockets; the strips wrap onto rows when the box is narrow.
8. **Plugged in**: A deck declares its channel and the mixer takes it; the screen and the back panel say what is plugged in where.
9. **Back panel**: It turns over to a line in per channel (left and right), the master out in balanced and unbalanced, booth and phones, link and power. The cables from the decks arrive at the line ins.
10. **Finishes**: All twelve, Tactile and Quiet: knobs, faders and faces read the kit's tokens.
11. **Reduced motion**: The mixer does not turn over; the meters update about eight times a second.

## How it works

Original. Every strip is made from one function, so they cannot drift apart. The meters and the sound read the same gains (mixLevels is pure and tested in Node). It needs the Tactile UI Kit's stylesheets on the page; the Code tab's example links them from /kit/ and plugs two Decks in with a Rig that draws the cables between them.