Comparison 01

About this block

Comparison 01 is a product comparison table that displays two or more items side by side with product images, specification rows, and checkmark or cross indicators for each attribute. Built with shadcn/ui Table and Badge components, it uses a sticky first column on desktop to keep attribute labels visible while scrolling horizontally through product columns. The table data (products, attributes, values) is passed as structured data objects.

When to use it

• Product or pricing pages where users need to compare specific options before purchasing
• SaaS tools that want to compare themselves to competitors in a structured, credible way
• E-commerce or marketplace pages where side-by-side specification comparison reduces decision friction
• Documentation or feature matrix pages where a visual comparison table is more scannable than prose

Notes

Keep the attribute list to 8–12 rows for readability. More than 12 attributes make the table scroll-heavy on mobile. Group attributes by category and separate groups with a subtle row divider.