Component Browser
BrowseBuild
Home/Browse/Comparison 2

Comparison 2

ImageButtons3 ColumnsBentoCardsImage/Video Right99 nodes ยท 42 styles
Comparison 2

Description

Product comparison table with alternating row backgrounds and zebra striping

Detailed Analysis

This comparison layout is similar to Comparison 1 but features alternating gray backgrounds on feature rows (zebra striping) for improved readability. The table includes a header section with tagline, heading, and description, followed by a comparison matrix with product icons, names, and descriptions at top. Feature rows alternate between white and light gray backgrounds, displaying text values or checkmark/X indicators. Two action buttons sit below the table.

Webflow Paste

Copy and paste directly into Webflow Designer

Keywords

comparison tablezebra stripingalternating rowsproduct comparisonfeature matrixcheckmark indicatorstwo productsstriped tablefeature listcomparison gridreadable tablecheck and xrow backgroundsproduct icons

Raw Data (spacer)

{
  "meta": {
    "droppedLinks": 0,
    "dynBindRemovedCount": 0,
    "unlinkedSymbolCount": 0,
    "paginationRemovedCount": 0,
    "dynListBindRemovedCount": 0
  },
  "type": "@webflow/XscpData",
  "payload": {
    "ix1": [],
    "ix2": {
      "events": [],
      "actionLists": [],
      "interactions": []
    },
    "nodes": [
      {
        "_id": "da3ee342-b8a0-a899-7a97-c2c046079415",
        "tag": "section",
        "data": {
          "tag": "section",
          "attr": {
            "id": ""
          },
          "text": false,
          "xattr": [],
          "search": {
            "exclude": false
          },
          "devlink": {
            "slot": "",
            "runtimeProps": {}
          },
          "visibility": {
            "conditions": []
          },
          "displayName": ""
        },
        "type": "Block",
        "classes": [
          "4cc327f9-dc0e-3a28-659d-b72cbedc5ec1"
        ],
        "children": [
          "da3ee342-b8a0-a899-7a97-c2c046079416"
        ]
      },
      {
        "_id": "da3ee342-b8a0-a899-7a97-c2c046079416",
        "tag": "div",
        "data": {
          "tag": "div",
          "attr": {
            "id": ""
          },
          "text": false,
          "xattr": [],
          "search": {
            "exclude": false
          },
          "devlink": {
            "slot": "",
            "runtimeProps": {}
          },
          "visibility": {
            "conditions": []
          },
          "displayName": ""
        },
        "type": "Block",
        "classes": [
          "b0934d9a-875a-bb42-0630-12090a77fc73"
        ],
        "children": [
          "da3ee342-b8a0-a899-7a97-c2c046079417"
        ]
      },
      {
        "_id": "da3ee342-b8a0-a899-7a97-c2c046079417",
        "tag": "div",
        "data": {
          "tag": "div",
          "attr": {
            "id": ""
          },
          "text": false,
          "xattr": [],
          "search": {
            "exclude": false
    
... (truncated)