Lenso UI

Foundation component · Actions

Button

Trigger a clear user action with consistent emphasis, density, and interaction feedback.

Live playground

Choose Button when

  • Use Button for explicit, user-initiated actions.
  • Keep one primary action per focused surface.
  • Use Ghost only for low-emphasis actions in toolbars or compact groups.

Labels and feedback

  • Use a clear action label; icon-only actions need an accessible name.
  • Keep focus-visible and loading feedback intact.
  • Disabled actions must not be the only explanation.

Implementation

Choose emphasis and size through typed variants; native button behavior and Base UI composition remain available.

import { Button } from "@lenso/ui/button";

<Button variant="primary" size="compact">
  Create issue
</Button>;
Lenso UI