Agile JavaScript Kanban Board for Task Management Apps

Develop full-fledged web apps with DHTMLX JavaScript Kanban library to gain complete control over the workload and manage tasks efficiently.

Key Features of DHTMLX JavaScript Kanban Board

• Rich Javascript API to control each aspect of UI/UX
• Fully configurable
• Integration with DHTMLX Gantt, Scheduler, and To Do List
• Touch support
• Creating and editing columns and swimlanes
• Drag and drop of cards and multiselection
• Moving columns and rows from the UI
• Searching and sorting
• Customized suggestions in search results
• Creating and editing tasks
• Duplicating tasks
• Limiting the number of cards in columns and swimlanes
• Localization
• Assigning tasks to a teammate
• Assigning due dates
• Setting the priority of tasks
• Commenting and voting for tasks
• Attachments to cards
• Expanding and collapsing columns
• TypeScript support
• Lazy rendering and column scroll
• Undo/redo actions
• Readonly mode
• Grouping tasks
• Links between tasks
• Custom template for column's header

Get Started with DHTMLX JS Kanban Board

Creating and editing tasks

The DHTMLX Kanban board allows creating any number of tasks and editing them via the right panel. Users can edit tasks' name and description, define priority, mark cards with colors, change progress, set start/end dates, and assign responsible persons. Besides, it is possible to attach files via a file uploader and add any custom fields you need.

Card multi-select and drag-n-drop

With our Kanban js library, users may arrange tasks between columns and swimlanes via drag-n-drop. You can enhance their experience and allow selecting and dragging several tasks by setting up the multiselect feature. It is also possible to disable dragging cards to specific columns.

Searching and sorting

DHTMLX Kanban widget makes it possible to quickly find a necessary task in a matter of seconds. Users can search for a task by its label or description and then select the required one from the dropdown list. It is possible to sort cards in ascending or descending order. Besides, you can enable the state of preserved sorting.

Custom Kanban cards

The flexible API of our JavaScript Kanban library allows developers to add a new HTML template to manage the shape and behavior of task cards. Thus, you can fine-tune not only the shape and colors but also the available fields and states for selecting and dragging cards.

Custom toolbar

If needed, you can hide the toolbar of your JavaScript Kanban component. Otherwise, there are ample opportunities for its configuration and customization. It is easy to rearrange controls, place a search bar and define its behavior, modify the sorting function, and equip the toolbar with custom controls.

Custom styles

Several predefined themes (Material, Willow, and Willow Dark) can be a basis for styling your JS Kanban board. You are free to customize each element, from columns, rows, and cards to the scroll bar, separate icons, and controls. It is possible due to CSS variables.

Why Choose DHTMLX JavaScript Kanban Library?

Feature-rich out of the box

Our Kanban widget is developed to meet the needs of a wide variety of web applications. Users take control of the whole workflow on a compact Kanban board by dividing tasks into any number of categories, setting task priority, assigning tasks to team members, and tracking the progress of tasks with deadlines, and intuitive progress bars.

Fully customizable

You can customize each UI element of the JavaScript Kanban board to match your web app. Our rich API encompasses numerous methods and options for manipulating columns, rows, and cards. We have introduced CSS variables to style the toolbar and editor and even customize a scroll bar.

Integration with DHTMLX widgets

You can use the DHTMLX Kanban js library separately or combine it with other components such as the Gantt chart, Scheduler, or To Do List. The Kanban board can be easily synced with these widgets and provide insight into particular stages of the project for specific departments or teams.

Support for touch screens

All JavaScript Kanban features work on touch screens to simplify the use of the task board during your daily routine. Users can quickly select a card with a tap, edit its description, and move to the proper column or row with drag-n-drop. You can enable automatic scrolling to a newly added element, so that users won't have to scroll the board manually.