Blocks

Comparison Block

2 min read

> Side-by-side feature comparison table for plans, products, or services.


Overview

The Comparison block creates a two-column comparison table ideal for showcasing differences between product tiers, service plans, or competitive alternatives. Each feature row can display check marks, X marks, partial indicators, or custom text.


Fields

FieldDescription
HeadingOptional section title above the comparison
SubheadingSupporting text below the heading
Column A TitleTitle for the first column (e.g., "Basic")
Column B TitleTitle for the second column (e.g., "Pro")
FeaturesRepeatable feature rows with indicators
StyleVisual style: Default, Cards, or Minimal
Content WidthControl the maximum width of the content area
AnimationEntrance animation with optional stagger effect

Feature Fields

Each feature row includes:

FieldDescription
FeatureThe feature name or description (required)
Column AIndicator type: Check, X, Partial, or Custom
Column A TextCustom text when Column A is set to "Custom"
Column BIndicator type: Check, X, Partial, or Custom
Column B TextCustom text when Column B is set to "Custom"

Indicator Types

IndicatorDisplay
CheckGreen checkmark indicating feature is included
XRed X indicating feature is not included
PartialYellow indicator for limited availability
CustomYour own text (e.g., "5 users", "Unlimited")

Style Options

StyleDescription
DefaultStandard comparison table
CardsEach column in a card container
MinimalClean, borderless appearance

Examples

Choose Theme