Solid kanban blocks.

The 100 kanban blocks are boards with columns and cards: sprints, pipelines, support queues, hiring, content calendars and matrices. Each shows a working board with moves by drag, keyboard or menu, a status line and column totals worked out from the cards.

There are 15 groups by use: Sprint boards, Pipelines and gates, Bugs, tests and reviews, People lanes, Hiring and onboarding, Matrices and grids, and more. The boards differ in their rules and figures: a sprint board totals points, a sales board totals value, a gate board refuses moves until checks pass.

Agile Sprint Board Kanban is the base the others copy, with points and a rule that nothing reaches Done without review. Deployment Gates Kanban blocks a move until three checks are ticked. CRM Deals Kanban totals value and a weighted value per column. Eisenhower Matrix Kanban places cards on a grid instead of in lanes.

A long comment describes the board, then typed COLUMNS and START card arrays, small helpers that count and total, a move function and the component. Nothing is saved: a reload puts the board back to START.

Cards are dragged by their grip with pointer events, with no drag library. Focus the grip and press Space to pick the card up, the arrow keys to move it, Space to drop and Escape to cancel. Each card also has a Move to menu for touch and single-pointer use, and a polite status line announces every move.

The cards live in useState, seeded from the START array, and moves go through a moveCard function that returns the new list. Call your API where the block sets the new cards after a move, and load START from your database instead. If the request fails, set the previous cards back.

Edit the COLUMNS array (an id and a name each) and the cards' column field. Column heads count their cards and total their points or values from the cards, so adding a column needs no other change besides the cards you place in it.

Most boards route every move through a refusal function that returns a reason or an empty string. Agile Sprint Board Kanban refuses a move to Done unless the card is in In review, and Deployment Gates Kanban names the first unticked check. Add a work-in-progress cap by returning a reason when a column is full, and the status line says it.

Edit the card interface and the card body component: the sprint board keeps a title, a kind, points and an owner, shown as a badge, a points figure and initials. Add your fields to the type, the START data and the body, and update the total helper if the column head should sum them.

This page lists 100 of the category's 100 kanban blocks for Solid. The category comes in React (Base UI, React Aria, Ark UI and Radix UI), Vue, Svelte and Solid; the framework and UI library pickers at the top of any block's page switch between them.

The Solid kanban blocks are the React ones ported to Solid, on Ark UI's Solid primitives. They keep the layout, the copy and the theme tokens, and install with shadcn (/r/solid/kanban-agent-tasks.json).

Each block is TypeScript and Tailwind CSS v4, styled with your theme's tokens. Solid needs solid-js @ark-ui/solid lucide-solid installed once, and the CLI fetches the components a block imports.

Open a block and copy its command: `shadcn@latest add` with the block's registry URL, such as /r/solid/kanban-agent-tasks.json for Agent Tasks Kanban. Run the project setup once first, and the code is yours to edit.

The block's file and the components it imports, installed before it, each as its own registry item. Nothing else changes in your project.

Use the filters above the grid: 15 kinds of kanban block, led by content and creative (11), assets and inventory (9), pipelines and gates (8) and bugs, tests and reviews (8), and sort by popular or name. A good first look: Agent Tasks Kanban, Agile Sprint Board Kanban and API Endpoint Tracker Kanban. Each card opens the block's live page.

Every block draws the same page column and side rails with a top rule only (the Guides component), so a kanban block lines up with the one above and below it. Stack one per section and the rails read as a single drawing; pick across the delivery and engineering, people and teams and plans and priorities kinds.

Open its page and use the full-screen viewer (/view/kanban/solid/agent-tasks) or the device-width previews. Every preview is free for everyone; only the code needs Pro.

Each kanban block uses semantic HTML: one heading level, real lists and labelled controls. Interactive parts sit on Ark UI, a headless library that follows the WAI-ARIA patterns, and the layouts use logical properties so they hold in right-to-left languages.

Yes. They use semantic tokens only (bg-card, text-muted-foreground), never palette colors, so they follow your preset, radius and dark mode. The primary color marks one action per block and is never a background.

No animation library: the kanban blocks' motion is CSS (transitions, entrance animations and SVG), and it stands still under prefers-reduced-motion.

The previews are free for everyone. The code of all 100 kanban blocks is Pro, as is every block: Pro unlocks the code, the install command and the MCP.

Only with a Team or Organization license: client work, SaaS products and anything your users pay for. The Individual license is for personal, non-commercial projects. See the license page for the full terms.

You keep using what you installed in your existing projects, but get no new downloads or updates, and the MCP stops answering. A Lifetime license includes all future updates.

No. You can use them in your own End Products, but not redistribute the code or designs on their own, or in a UI library, kit, template or website builder.

With Pro, yes: the MCP server (22 tools, one personal URL from /dashboard/mcp) lets your agent search_blocks for a kanban block, read it with get_block and install it on your Solid stack.

Pass `category: "kanban"` to search_blocks to search only the 100 kanban blocks, or to list_blocks for the 15 groups with their blocks. get_block then returns one with its install command.

plan_page plans a page as a stack of blocks for a brief. Pass `sections` with category ids, such as ["hero", "kanban", "footer"], to force the order; each section gets a pick and two alternatives, and get_block installs the stack.