This family tree visualization displays a four-generation hierarchy using distinct colors and shapes for each layer: squares for the root, circles for grandparents, triangles for parents, and diamonds for children. Built with D3 v7, the example uses the `d3.hierarchy` and `d3.tree` APIs to compute the layout, `d3.linkVertical` for the connecting links, and `d3.symbol` with specific shape types and color functions per depth. Node positions are translated via SVG groups, with labels placed beneath each shape. The static data is embedded directly in the JavaScript code.