
Three-tier pricing table with monthly/annual toggle featuring plan descriptions, monthly and yearly pricing display, CTA buttons in the middle, and feature lists below.
This pricing layout presents three tiers (Basic, Business, Enterprise) with a unique card structure. Each card shows the plan name with a descriptive subtitle, followed by prominent monthly pricing with yearly equivalent displayed below. A full-width black CTA button appears mid-card, with the feature checklist below the button. The billing toggle at the top allows switching between monthly and annual views. Cards have clean borders with consistent spacing and typography hierarchy.
Copy and paste directly into Webflow Designer
{
"meta": {
"droppedLinks": 0,
"dynBindRemovedCount": 0,
"unlinkedSymbolCount": 0,
"paginationRemovedCount": 0,
"dynListBindRemovedCount": 0
},
"type": "@webflow/XscpData",
"payload": {
"ix1": [],
"ix2": {
"events": [],
"actionLists": [],
"interactions": []
},
"nodes": [
{
"_id": "d138a880-509f-3baf-11e8-31229e5589cf",
"tag": "section",
"data": {
"tag": "section",
"attr": {
"id": ""
},
"text": false,
"xattr": [],
"search": {
"exclude": false
},
"devlink": {
"slot": "",
"runtimeProps": {}
},
"visibility": {
"conditions": []
},
"displayName": ""
},
"type": "Block",
"classes": [
"29d6587e-d731-9be1-0649-8cc2309d1f2f"
],
"children": [
"d138a880-509f-3baf-11e8-31229e5589d0"
]
},
{
"_id": "d138a880-509f-3baf-11e8-31229e5589d0",
"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": [
"d138a880-509f-3baf-11e8-31229e5589d1"
]
},
{
"_id": "d138a880-509f-3baf-11e8-31229e5589d1",
"tag": "div",
"data": {
"tag": "div",
"attr": {
"id": ""
},
"text": false,
"xattr": [],
"search": {
"exclude": false
... (truncated)