Angular-Komponentenbibliothek für Standalone-Apps
Wiederverwendbare Angular-UI-Komponenten für Standalone-Apps, Angular Signals-Workflows, Barrierefreiheit, CSS-Variablen und produktionsreife Dokumentation zu Modals, Datentabellen, Navigation, Kalendern und mehr.
npm install ng-hub-ui-modal<hub-panels /><hub-avatar /><hub-skeleton />--hub-sys-color-primarynpm i ng-hub-ui-*Eine Bibliothek, jede Marke
Jede Komponente wird von CSS-Variablen gesteuert. Wähle ein Design und beobachte, wie sich die gesamte Seite neu zeichnet — ohne Rebuild, ohne zusätzliches CSS.
Probier es aus — das wechselt das Live-Design der gesamten Seite.
Gebaut für Angular-Arbeit in Produktion
Beginne mit der Komponentenkategorie, die normalerweise am meisten Zeit kostet, um sie wirklich gut umzusetzen.
Modal- und Overlay-Abläufe
Dialoge, Vollbildabläufe, Projektionen und service-gesteuerte Overlays für Angular-Apps, die barrierefreies Modal-Verhalten benötigen.
Datentabellen und Listen
Serverseitige Paginierung, Sortierung, Filterung und Auswahl für Admin-Panels, Back Offices und Management-Dashboards.
Sortable und Drag-and-drop
Ordne Arrays, FormArray-Controls und verbundene Listen mit Angular-freundlichen Drag-and-drop-Werkzeugen neu an.
Terminplanung und Kalenderansichten
Kalenderoberflächen mit Ereignissen, Templates, Drag-and-drop und Theming-Hooks für Planungsabläufe.
Warum Hub UI?
Vollständig barrierefrei
Alle Komponenten folgen den WCAG 2.1-Richtlinien mit vollständiger Tastaturnavigation und Unterstützung für Screenreader.
Von CSS-Variablen gesteuert
Jede Komponente stellt CSS-Custom-Properties bereit. Überschreibe einen beliebigen Token, um ihn an deine Marke anzupassen — Änderungen wirken sich sofort auf alle Designs aus.
TypeScript zuerst
Durchgängig strenge Typisierung. Profitiere von vollständiger Autovervollständigung, Sicherheit zur Kompilierzeit und einer erstklassigen Entwicklererfahrung.
Standalone-Architektur
Aufgebaut auf Angulars modernem Standalone-Komponentenmodell. Importiere nur, was du brauchst, und halte deine Bundles schlank.
Echter Code, echte Komponente
Ein paar Zeilen Template genügen. Das Snippet links rendert die Live-Komponente rechts.
Alle Komponenten
Entdecke Angular-Komponenten für echte Produktteams, wiederverwendbare Design-Systeme und wartbare Standalone-Anwendungen.
Modal
Barrierefreie Angular-Modal-Komponente mit Stapelung, Vollbildmodus und Templates.
Paginable
Angular-Datentabelle und paginierte Liste mit Filterung, Sortierung und serverseitigen Operationen.
Sortable
Angular-Sortable-Werkzeuge für Arrays, FormArray-Controls und Drag-and-drop-Builder.
Calendar
Angular-Kalender-Komponente für Terminplanung, Ereignisse und Planungsoberflächen.
Avatar
Angular-Avatar-Komponente mit Initialen, Bild-Fallbacks und Statusanzeigen.
Board
Angular-Kanban-Board-Komponente mit Drag-and-drop für Workflow-Oberflächen.
Breadcrumbs
Angular-Breadcrumbs mit Router-Integration und benutzerdefinierten Templates.
History
Angular-Undo-und-Redo-Store für Editoren, Formulare und Low-Code-Builder.
Nav
Angular-Navigationsmenüs für Seitenleisten, Dropdowns, Drill-down-Panels und responsive Layouts.
Portal
Angular-Portal- und Overlay-Rendering für Drawer, schwebende Panels und dynamische Container.
Skeleton
Angular-Skeleton-Platzhalter mit Presets, Inline-DSL-Templates und responsiven Shimmer-Layouts.
Stepper
Angular-Stepper-Komponente für Wizard-Formulare, Onboarding und mehrstufige Validierungsabläufe.
Toast
Angular-Toast- und Benachrichtigungskomponente mit Positionierung, Stapelung und automatischem Ausblenden.
Buttons
Angular-Buttons, FAB, Speed Dial und Dropdown-Direktiven für aktionsreiche Oberflächen.
Badges
Angular-Badge-Komponente für Labels, Zähler und Statusanzeigen, vollständig themenfähig.
Panels
Angular-Panels- und Accordion-Komponente mit Einzel- oder Mehrfach-Ausklappen und vollem Theming.
Forms
Angular-Formularbibliothek mit umfangreichen Eingaben, Select, Validierung und dynamischem Rendering.
Milestones
Angular-Timeline- und Fortschrittsschritt-Komponente in vertikalem, horizontalem und animiertem Layout.
Utils
Angular-Hilfsbibliothek mit Overlays, Fokusverwaltung, Pipes und Übersetzungshelfern.
In Sekunden loslegen
Eine Komponente installieren
npm install ng-hub-ui-modalStandalone importieren
import { HubModalModule } from 'ng-hub-ui-modal';Mit CSS-Variablen anpassen
--hub-modal-border-radius: 1rem;Baue deine nächste Angular-UI mit Hub UI
Open Source, modular und produktionsreif. Installiere noch heute deine erste Komponente.