
Blog listing section with centered header, category filter tabs, and 3-column grid of article cards featuring images, category badges, titles, excerpts, and read more links.
This blog layout features a centered header section with 'Blog' label, main heading, and description. The category filter includes a bordered 'View all' button followed by category links. Article cards display in a 3-column grid format. Each card shows a featured image, category badge (dark pill-shaped), reading time indicator, article title, excerpt text, and a 'Read more' link with arrow icon. The design uses a light/minimal aesthetic with clear visual hierarchy. Cards have no borders, relying on spacing to define boundaries.
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": "40a3a367-6e82-d7ef-54bd-590690666709",
"tag": "header",
"data": {
"tag": "header",
"attr": {
"id": "blog-header-2"
},
"text": false,
"xattr": [],
"search": {
"exclude": false
},
"devlink": {
"slot": "",
"runtimeProps": {}
},
"visibility": {
"conditions": []
},
"displayName": ""
},
"type": "Block",
"classes": [
"bd48fb14-9795-f46e-1a2e-d0f2865fb4b6"
],
"children": [
"40a3a367-6e82-d7ef-54bd-59069066670a"
]
},
{
"_id": "40a3a367-6e82-d7ef-54bd-59069066670a",
"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": [
"40a3a367-6e82-d7ef-54bd-59069066670b"
]
},
{
"_id": "40a3a367-6e82-d7ef-54bd-59069066670b",
"tag": "div",
"data": {
"tag": "div",
"attr": {
"id": ""
},
"text": false,
"xattr": [],
"search": {
"exclude":
... (truncated)