Timeline 7

ImageButtonsBackground ImageList155 nodes · 50 styles

Description

Vertical timeline section with left-aligned header, tagline, buttons, and timeline entries featuring date labels, headings, descriptions, buttons, and image placeholders

Detailed Analysis

This timeline component combines a content header section with a vertical timeline layout. The top section includes a tagline, medium section heading, descriptive paragraph, and dual button group (primary outline and text link with arrow). Below, a vertical timeline with dot markers and connecting line displays entries with date labels, subheadings, body text, button pairs, and large image placeholders. Clean left-aligned design suitable for company history or project milestones.

Webflow Paste

Copy and paste directly into Webflow Designer

Keywords

timelinevertical timelinemilestoneshistory sectionchronologicaldate markersprogress indicatorcompany historyproject timelineeventsimage timelinebuttonstaglinecontent section

Raw Data (spacer)

{
  "meta": {
    "droppedLinks": 0,
    "dynBindRemovedCount": 0,
    "unlinkedSymbolCount": 0,
    "paginationRemovedCount": 0,
    "dynListBindRemovedCount": 0
  },
  "type": "@webflow/XscpData",
  "payload": {
    "ix1": [],
    "ix2": {
      "events": [
        {
          "id": "e-3431",
          "name": "",
          "action": {
            "id": "",
            "config": {
              "actionListId": "a-686",
              "affectedElements": {}
            },
            "instant": true,
            "actionTypeId": "GENERAL_CONTINUOUS_ACTION"
          },
          "config": [
            {
              "smoothing": 50,
              "addEndOffset": false,
              "startsExiting": false,
              "addOffsetValue": 50,
              "addStartOffset": false,
              "endOffsetValue": 50,
              "startsEntering": true,
              "continuousParameterGroupId": "a-686-p"
            }
          ],
          "target": {
            "id": "65e1215e005c55ebd076fa03|cf695bbf-ae17-04a1-04f5-05f0c9987870",
            "appliesTo": "CLASS",
            "styleBlockIds": [
              "c2b53bd5-2f3c-9844-cf74-9371ea2c80ea"
            ]
          },
          "targets": [
            {
              "id": "65e1215e005c55ebd076fa03|cf695bbf-ae17-04a1-04f5-05f0c9987870",
              "appliesTo": "CLASS",
              "styleBlockIds": [
                "c2b53bd5-2f3c-9844-cf74-9371ea2c80ea"
              ]
            }
          ],
          "createdOn": 1709650312235,
          "eventTypeId": "SCROLLING_IN_VIEW",
          "mediaQueries": [
            "main",
            "medium",
            "small",
            "tiny"
          ],
          "animationType": "custom"
        }
      ],
      "actionLists": [
        {
          "id": "a-686",
          "title": "Timeline Circle [Scroll]",
          "createdOn": 1709627079937,
          "continuousParameterGroups": [
            {
              "id": "a-686-p",
              "type": "
... (truncated)

Detailed Analysis

{ "meta": { "droppedLinks": 0, "dynBindRemovedCount": 0, "unlinkedSymbolCount": 0, "paginationRemovedCount": 0, "dynListBindRemovedCount": 0 }, "type": "@webflow/XscpData", "payload": { "ix1": [], "ix2": { "events": [ { "id": "e-3431", "name": "", "action": { "id": "", "config": { "actionListId": "a-686", "affectedElements": {} }, "instant": true, "actionTypeId": "GENERAL_CONTINUOUS_ACTION" }, "config": [ { "smoothing": 50, "addEndOffset": false, "startsExiting": false, "addOffsetValue": 50, "addStartOffset": false, "endOffsetValue": 50, "startsEntering": true, "continuousParameterGroupId": "a-686-p" } ], "target": { "id": "65e1215e005c55ebd076fa03|cf695bbf-ae17-04a1-04f5-05f0c9987870", "appliesTo": "CLASS", "styleBlockIds": [ "c2b53bd5-2f3c-9844-cf74-9371ea2c80ea" ] }, "targets": [ { "id": "65e1215e005c55ebd076fa03|cf695bbf-ae17-04a1-04f5-05f0c9987870", "appliesTo": "CLASS", "styleBlockIds": [ "c2b53bd5-2f3c-9844-cf74-9371ea2c80ea" ] } ], "createdOn": 1709650312235, "eventTypeId": "SCROLLING_IN_VIEW", "mediaQueries": [ "main", "medium", "small", "tiny" ], "animationType": "custom" } ], "actionLists": [ { "id": "a-686", "title": "Timeline Circle [Scroll]", "createdOn": 1709627079937, "continuousParameterGroups": [ { "id": "a-686-p", "type": " ... (truncated)