Studiov1.2.3
Studio/Patterns/Comparison Table

Comparison Table

Data Display

Two-column table comparing before/after, old/new, or problem/solution pairs. Used to present clear contrasts.

All patterns
comparison table
Reusable pane preview
Use Cases
  • Old vs new system comparison (RCCS flaws vs solutions)
  • Before/after transformation
  • Competitor comparison
  • Traditional vs regenerative approach
Do
  • Use clear column headers with contrasting labels
  • Keep rows short and scannable
  • Use color coding (red/green or muted/accent) for columns
  • Limit to 5-8 rows for readability
Avoid
  • Compare more than 2 things (use pricing table for 3+)
  • Write full paragraphs in cells
  • Mix comparison types in one table
  • Use without a section header explaining the comparison
Reference component: ComparisonTableVariants: 2Token bindings: 5