Angular Kanban Board Component | ng-hub-ui-board
Angular Kanban board component with drag and drop, custom card templates, column workflows and CSS variables for business dashboards.
Overview
Why teams search for this library
This Angular board component helps you ship Kanban-style workflows with drag and drop, flexible templates and scalable interaction patterns for real business tooling.
Install
npm install ng-hub-ui-boardJump to
Ideal for
- task boards
- pipeline tracking
- CRM workflows
- operations dashboards
About board
ng-hub-ui-board is designed for Angular products that need more than a static list: task tracking, CRM pipelines, support workflows or internal operations dashboards. It keeps card rendering flexible while preserving a consistent board interaction model.
Feature guides
Basic Usage
Fundamental board features
Examples:
Basic Board Example
Basic Board Example
Live preview is not available for this example yet.
Code
Interactions
User interaction capabilities
Examples:
Card Drag & Drop
Card Drag & Drop
Live preview is not available for this example yet.
Code
Column Reordering
Column Reordering
Live preview is not available for this example yet.
Code
Card Click Event
Card Click Event
Live preview is not available for this example yet.
Code
Board Events
Board Events
Live preview is not available for this example yet.
Code
Advanced Features
Scrolling and advanced behavior
Examples:
Infinite Scroll
Infinite Scroll
Live preview is not available for this example yet.
Code
Templates
Customizing appearance
Examples:
Custom Card Template
Custom Card Template
Live preview is not available for this example yet.
Code
Custom Header Template
Custom Header Template
Live preview is not available for this example yet.
Code
Custom Footer Template
Custom Footer Template
Live preview is not available for this example yet.
Code
Custom Card Placeholder
Custom Card Placeholder
Live preview is not available for this example yet.
Code
Custom Column Placeholder
Custom Column Placeholder
Live preview is not available for this example yet.
Code
Custom Drag Preview
Custom Drag Preview
Live preview is not available for this example yet.
Code
Configuration
Board configuration options
Examples:
Disable Sorting
Disable Sorting
Live preview is not available for this example yet.
Code
Custom Scroll Padding
Custom Scroll Padding
Live preview is not available for this example yet.
Code
Drag Behavior Modes
Drag Behavior Modes
Live preview is not available for this example yet.
Code
Styling
Customizing appearance via CSS variables
Examples:
CSS Customization
CSS Customization
Live preview is not available for this example yet.
Code
Key features
Drag and drop workflows
Move cards and columns naturally in Angular interfaces used for planning, operations or CRM processes.
Custom card templates
Render rich cards with actions, badges, metadata and domain-specific layouts.
Built for internal tools
Useful for team boards, delivery pipelines and operational back-office experiences.
Recent changes
No changelog entries available.