TaskFlow
Get Started

52 Pages · Light & Dark · Tailwind v4

Ship the Dashboard. Not the Boilerplate.

TaskFlow is the production-ready project management dashboard built on Tailwind CSS v4 — measured for contrast, responsive to 360px, with no framework lock-in.

Explore all demos Open dashboard
51 live demo screens Light & dark themes Mobile ready
TaskFlow sales dashboard in light theme

Why build on TaskFlow

Every colour is a token, every breakpoint is deliberate, and both themes are measured against WCAG AA — not eyeballed.

Efficient, Clean Code Structure

Static multi-page markup with build-time partials and 35 small JS modules. Every file is commented, so the next developer can read it without a tour.

Documentation & Support

A written guide covers the build, the design tokens and the conventions — including the gotchas that would otherwise cost you an afternoon.

Built to Keep Working

Both themes are measured against WCAG AA and every page is swept for overflow from 360px up — so changes land without quietly breaking a screen.

Technologies

The tools that power the template — no bespoke abstractions to learn before you can move a button.

  • HTML5
  • Tailwind CSS v4
  • Webpack 5
  • Vanilla JS
  • ApexCharts
  • PostCSS
  • npm
  • Inter

Discover demos

51 screens, each shipped in both themes. Every card links to the live page.

Foundations & components

The building blocks behind every screen above, each with a live example and copyable markup.

Buttons Variants and sizes Cards Panels and surfaces KPI Cards Metric tiles Tables Sort, filter, select Charts Theme-aware ApexCharts Tabs Underline, pill, icon Avatar Sizes and groups Grid Layout primitives
Read the documentation

What's in the download

Full source, no obfuscation, no license server. Run npm install and you are building in under a minute.

  • 52 HTML pages, commented throughout

    Including 15 authentication screens across three layouts.

  • Tailwind v4 source, not compiled output

    One stylesheet of tokens and component classes you can actually edit.

  • 35 vanilla-JS component modules

    Scrum board, calendar, tables, charts — no framework runtime.

  • Webpack build, pre-configured

    Dev server, hot reload, and a production build that just works.

  • Written documentation

    Build, tokens, conventions — and the gotchas that would otherwise cost you an afternoon.

taskflow/
src/
├── index.html            Landing / overview
├── https://taskflow-html-softivus.netlify.app/sales-dashboard
├── crm-dashboard.html
├── scrumboard.html
├── … 48 more pages
├── partials/
│   ├── sidebar.html      Injected at build time
│   ├── topbar.html
│   └── footer.html
└── assets/
    ├── css/index.css     Tokens + components
    ├── js/
    │   ├── index.js      Single entry point
    │   └── components/   35 modules
    └── images/

Frequently Asked Questions

Licensing, updates and support — the things worth knowing before you buy.

What is a Regular License?

A Regular License covers one end product that is free for its end users. It suits an internal tool, a client project, or an app where nobody is charged to access what you have built.

What is an Extended License?

An Extended License covers one end product where end users are charged — a paid SaaS, a subscription dashboard, or anything sold to the people who use it.

Can I use one license for multiple applications?

No — a license covers a single end product. A second app needs a second license, whichever type you hold.

Do you offer a custom license for multiple products?

Yes. If you are building several products on the template, get in touch and we will price a bundle rather than have you buy a license at a time.

Do all license types include updates and support?

Every license includes free updates and support. Support covers defects and questions about the template itself, not custom development on top of it.