Previous Data Grid Next Comparison Table

Pricing Table

Side-by-side plan comparison table with feature rows.

This page is a scaffold for the Pricing Table component. Build the live markup, Alpine.js interactions, and DaisyUI/Tailwind classes here, then replace this placeholder block with the real preview + code snippet.

Planned variants & states to implement:

  • Feature rows vs plan columns
  • Checkmark / × cells
  • Highlighted plan column
  • Sticky header row
  • Mobile plan switcher
5

Basic Table

Simple HTML table with styled rows, headers, and zebra striping.

Responsive Table

Horizontally scrollable table for small viewports.

Sortable Table

Column-sortable table with ascending/descending toggle.

Data Grid

Feature-rich grid with pagination, filtering, and inline edit.

Comparison Table

Product or plan feature matrix with check/cross indicators.
Previous Data Grid Next Comparison Table