Skip to main content



Optional. An array of objects containing the columns data


columns?: [
id: string,
label?: string,
collapsed?: boolean,
limit?: number | object,
strictLimit?: boolean
{...} // other columns data


For each column you can specify the following parameters (data):

  • id - (required) a column ID. It is used for managing the column via the corresponding methods
  • label - (optional) a column label. It is displayed in the column section
  • collapsed - (optional) a current state of the column. If true, the column is collapsed initially. Default value is false (expanded state)
  • limit - (optional) this parameter may take one of the two types of values:
    • number - a limit of cards in the current column
    • object - an object with the limits of cards for each row (swimlane) by its ID
  • strictLimit - (optional) a strict limit mode. If true, a user will not be able to create new cards over the specified number via the limit parameter. Default value is false

If you want to load new data for columns dynamically, you can use the parse() method!


const columns = [
label: "Backlog",
id: "backlog",
collapsed: true,
limit: 3,
strictLimit: true
label: "In progress",
id: "inprogress",
collapsed: false,
limit: {
// limit the number of cards for the "Feature" and "Task" rows of the "In progress" column
feature: 3,
task: 2
strictLimit: false
{ label: "Done", id: "done" }

new kanban.Kanban("#root", {
// other parameters

Change log:

  • Starting from v1.1 the columns property is optional
  • The collapsed parameter was added in v1.1
  • The limit parameter was added in v1.1
  • The strictLimit parameter was added in v1.1

Related sample: Kanban. Limits for columns and swimlanes