Kanban Board
The Kanban Board gives Power Apps a clean, three-column task board — To do, In progress, Done — rendered as a single data-driven SVG Image. Cards are read from a collection and grouped into columns by their Status, so the whole board redraws from your data with no PCF and no premium connectors. It is the screen makers rebuild for every project and task tool.
Design login
Alice · UX
Build table
Alice · UX
Approvals flow
Alice · UX
Theme tokens
Alice · UX
Publish
Alice · UX
YAML source
Preview — full code with PRO# Kanban Board — PowerBlocks (PRO Screen)
# A 3-column board (To do / In progress / Done) rendered as a single data-driven
# Power Fx SVG Image: each card is read from a collection and placed in its column.
#
# STEP 1 — In Screen.OnVisible (or App.OnStart):
# ClearCollect(
# colKanban,
# { Title: "Design login screen", Tag: "Alice · UX", Status: "To do" },
# { Title: "Build data table", Tag: "Bob · Dev", Status: "To do" },
# { Title: "Wire approvals flow", Tag: "Clara · Dev", Status: "In progress" },
# { Title: "Theme tokens", Tag: "Alice · UX", Status: "In progress" },
# { Title: "Publish to Teams", Tag: "David · DSI", Status: "Done" }
# );
# STEP 2 — Paste onto a blank screen. STEP 3 — Swap colKanban for your data; the
# … full component definition unlocked with PROThis is a partial preview. Unlock the full component →
Common use cases
Project & task boards
Visualise work in progress across stages for a project, sprint or backlog.
Workflow stages
Show items moving through any pipeline — leads, requests, tickets — by status.
Team overviews
Give a manager an at-a-glance board of what's queued, active and done.
How to use Kanban Board in Power Apps
- 1Add the colKanban collection to Screen.OnVisible using the snippet in the YAML header.
- 2Choose your locale (EN or FR) and click "Copy YAML".
- 3Paste the control onto a blank screen in Power Apps Studio.
- 4Swap colKanban for your own data — cards regroup into columns by Status automatically.
Tip — To move a card, Patch its Status (e.g. from a card-tap action) and the board redraws. For true drag-and-drop, layer transparent buttons over each card area.