Angular Button Library | ng-hub-ui-buttons

Complete Angular 22 button system with signal-based API — standard buttons, FAB, speed dial and overlay dropdown. Zero dependencies beyond ng-hub-ui-utils.

Übersicht

Warum Teams nach dieser Bibliothek suchen

Use ng-hub-ui-buttons when you need a unified, themeable button ecosystem that covers every interaction pattern — from inline CTA to floating action overlays — with a single consistent API built on Angular Signals.

Installieren

npm install ng-hub-ui-buttons

Springen zu

Ideal für

  • primary call-to-action buttons
  • floating action menus
  • context-menu dropdowns
  • icon-only toolbar actions

Über buttons

ng-hub-ui-buttons is a zero-dependency button library for Angular 22+ standalone apps. It ships HubBtnComponent and HubBtnDirective (five variants × six colours × four sizes), HubFabComponent (nine fixed positions), HubSpeedDialComponent and HubDropdownDirective (overlay-based, powered by ng-hub-ui-utils OverlayService). Every visual property is a CSS custom property so the whole system themes with a single stylesheet override.

Funktionsleitfäden

Button Variants

Five visual styles (solid, outline, soft, ghost, link) × six semantic colours with size scale sm–xl.

Beispiele:
Button Variants

Button Variants

Solid PrimarySolid SuccessSolid Danger
Outline PrimaryOutline SuccessOutline Danger
Soft PrimarySoft SuccessSoft Danger
Ghost PrimaryGhost SuccessGhost Danger
Link PrimaryLink SuccessLink Danger

Floating Action Button

Fixed-position circular button with nine placement presets and optional scroll-collapse behaviour.

Beispiele:
Floating Action Button

Floating Action Button

FAB preview area — fixed within this container via CSS containment

Speed Dial

Expandable FAB that reveals a stack of action items. Closes on Escape or backdrop click.

Beispiele:
Speed Dial

Speed Dial

Letzte Änderungen