Kanban board

A sprint board with three columns. Each task lives in a swipe row — swipe left on touch, or hover on desktop, to reveal archive/delete actions. Columns scroll independently via scroll area, and the Filters button opens a drawer. Tasks carry tags, avatars, and a count badge per column.

Preview full screen

Use it

This example is one self-contained file. Link the JLDS stylesheets and the behavior bundle from the CDN, then paste the markup. See Vanilla HTML for the full workflow.

<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/jarooda/jlds@main/registry/css/index.css">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/jarooda/jlds@main/registry/css/all.css">
<script src="https://cdn.jsdelivr.net/gh/jarooda/jlds@main/registry/js/all.js" defer></script>

curl -O https://cdn.jsdelivr.net/gh/jarooda/jlds@main/registry/examples/kanban.html

Components used

Swipe Row · Scroll Area · Drawer · Tag · Avatar · Badge · Select · Button