RhombusKit

Button

Buttons trigger an action or a navigation. RhombusKit wraps Angular Material's matButton directive with a curated variant / size / appearance API and routes every colour through the token contract — toggle the theme above and the buttons re-skin without touching markup.

Example

When to use

  • Use a button to trigger an action (save, submit, open a dialog).
  • Give a view exactly one primary button for its main action; use secondary or ghost for supporting actions and danger for destructive ones.

When not to use

  • For moving between pages or to an external URL, set routerLink / href so the button renders a real <a> (see Link buttons below) — don't fake a navigation with (click) on a plain button.
  • For an on/off setting that takes effect immediately, use a Switch rather than a button.
  • For row-level actions hidden behind a "more" affordance, use an Overflow Menu.

Related components

  • Menu — action lists off a trigger.
  • Chip — compact, selectable tokens.
  • Switch — immediate on/off settings.
  • Dialog — modal surfaces buttons often open.

Was this page helpful?