Studio
Studio/Kits
New kit
Canonical inventory
Actions · core

Split button

action.split-button

Split button: An action control that lets a person invoke or change an operation.

split buttonbutton with a separate arrowmain action plus dropdowncombo action buttonthe thing you clickthe action control
States5
Touch target44px
Evidence6
Introduced by3 kits
Visual specimen

Same contract. Every kit voice.

MAVAN renderingdefault
Translation table

What code calls it.

Webgrouped <button> elementsThe closest native or standardized web primitive.direct
ARIAbuttonNo single ARIA role represents the complete component.pattern
SwiftUICustom View compositionSwiftUI has no single direct equivalent; compose and name the behavior explicitly.approximation
AppKitCustom NSView compositionAppKit has no single direct equivalent; use a custom view or controller composition.approximation
Anatomy

Every part, named.

  1. 1Interactive container
  2. 2Visible label or icon
  3. 3Action target
  4. 4State treatment
  5. 5Focus indicator
Often confused with

Similar shape. Different contract.

Button groupaction.button-group

Shares a visual family, but has a different role, state model, or interaction contract.

Dropdown menunavigation.dropdown-menu

Can look similar in context, but belongs to a different semantic and behavioral family.

Prompt · paste into your agent

Ask for the exact thing.

Implement the canonical Split button component (action.split-button). Split button: An action control that lets a person invoke or change an operation. Support these states: default, hover, focus-visible, active, disabled. Use semantic design tokens rather than raw visual values. Preserve a minimum 44px touch target where interactive. Provide and verify: implementation, state-matrix, responsive, keyboard, touch, reduced-motion. Keep the component API stable so every Studio kit can supply its own rendering without changing the behavior contract.
Studio contract

What must be proven.

Required states

default · hover · focus-visible · active · disabled

Required evidence

implementation · state-matrix · responsive · keyboard · touch · reduced-motion

Source union

jade · lumen · aurora