Component Browser
BrowseBuild
Home/Browse/Pricing 40

Pricing 40

ImageButtonsSlider139 nodes ยท 31 styles
Pricing 40

Description

Three-tier pricing with plan descriptions, monthly and yearly pricing, mid-card CTA buttons, and feature lists below in bordered cards.

Detailed Analysis

This three-column pricing layout presents Basic, Business, and Enterprise tiers with a structured card design. Each card shows plan name with descriptive subtitle, horizontal divider, monthly price with yearly equivalent, and a full-width black CTA button in the middle. Feature lists with checkmarks appear below the CTA. The mid-card button placement creates clear visual separation between pricing information and feature details. Progressive feature counts guide tier selection.

Webflow Paste

Copy and paste directly into Webflow Designer

Keywords

pricingthree columnsplan descriptionyearly pricingmid-card CTAfeature listcheckmarkspricing cardstiered pricingSaaS pricingmonthly annualstructured layouttier comparison

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": "9e25ebe2-024e-d014-9df1-a94509717b3f",
        "tag": "section",
        "data": {
          "tag": "section",
          "attr": {
            "id": ""
          },
          "text": false,
          "xattr": [],
          "search": {
            "exclude": false
          },
          "devlink": {
            "slot": "",
            "runtimeProps": {}
          },
          "visibility": {
            "conditions": []
          },
          "displayName": ""
        },
        "type": "Block",
        "classes": [
          "47cb99e7-6691-c0f5-2c93-5bde6576b578"
        ],
        "children": [
          "9e25ebe2-024e-d014-9df1-a94509717b40"
        ]
      },
      {
        "_id": "9e25ebe2-024e-d014-9df1-a94509717b40",
        "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": [
          "9e25ebe2-024e-d014-9df1-a94509717b41"
        ]
      },
      {
        "_id": "9e25ebe2-024e-d014-9df1-a94509717b41",
        "tag": "div",
        "data": {
          "tag": "div",
          "attr": {
            "id": ""
          },
          "text": false,
          "xattr": [],
          "search": {
            "exclude": false
    
... (truncated)