Hopf Fibration

Interactive application

By Juan Carlos Ponce Campuzano, 26/August/2025


What is a Hopf fibration?

The Hopf fibration is a fundamental construction in topology that gives a surprising way of decomposing higher-dimensional spheres. Formally, it is a continuous map from the 3-sphere to the 2-sphere:

\( h: S^3 \to S^2 \)

with the remarkable property that the preimage \( h^{-1}(p) \) of every point \( p \in S^2 \) is a circle \( S^1 \). In other words, \(S^3\) can be written as a disjoint union of circles (called fibers), one for each point on the ordinary 2-sphere.

Why is it important?

The Hopf fibration is not just a mathematical curiosity; it plays a central role in both mathematics and physics:

  • In Mathematics: It was the first known example of a non-trivial fiber bundle, showing that spaces can be “twisted together” in globally non-obvious ways (since \( S^3 \not\cong S^2 \times S^1 \)). It is a key example in homotopy theory, differential geometry, and the study of characteristic classes.
  • In Physics: The fibration provides geometric insight into physical systems:
    • Quantum Mechanics: The state space of a pure qubit is the 3-sphere \( S^3 \). The Hopf map projects this space onto the Bloch sphere \( S^2 \), which represents observable states.
    • Field Theory & Optics: It models the topology of magnetic fields (e.g. Dirac monopoles, Hopfions) and describes structured light beams whose polarization is linked to spatial geometry.

In essence, the Hopf fibration builds a bridge between abstract topology and the geometry of our physical world.

Note: This project was inspired by Richard Behiel's video A Quick Intro to Fiber Bundles (Hopf Fibration). For further reading, see Zachary Treisman's notes. Also check Thijs' GeoGebra applet: Hopf fibration.


Interactive Application


How this works?

To make the Hopf fibration visible, the fibers are turned into 3D geometry and displayed with Three.js. The library handles real-time rendering, lighting, and shading, leaving the focus on the underlying geometry. In this way, abstract mathematics becomes something you can explore visually and intuitively.

The visualization follows these steps:

  1. Sample directions \(n \in S^2\).
  2. Convert each direction into a spinor \((z_1, z_2)\).
  3. Generate points along the fiber by rotating the phase \(\theta \in [0, 2\pi)\).
  4. Apply stereographic projection \(S^3 \to \mathbb{R}^3\).
  5. Render the fibers using Three.js.

Terminology

The 3-Sphere \(S^3\)

The 3-sphere is defined by \[ S^3 = \{ (x_1, x_2, x_3, x_4) \in \mathbb{R}^4 \mid x_1^2 + x_2^2 + x_3^2 + x_4^2 = 1 \}. \] It can also be expressed in complex coordinates \((z_1, z_2) \in \mathbb{C}^2\) with \[ z_1 = x_1 + i x_2, \quad z_2 = x_3 + i x_4, \quad |z_1|^2 + |z_2|^2 = 1. \]

Spinor Representation

Given a point \(n = (x,y,z)\) on \(S^2\), a corresponding spinor is \[ z_1 = \sqrt{\tfrac{1+n_z}{2}}, \quad z_2 = \frac{x + i y}{2 z_1}. \] This representation is convenient for generating Hopf fibers.

Hopf Fiber Parametrization

A fiber associated to \((z_1, z_2)\) is \[ (z_1 e^{i \theta},\, z_2 e^{i \theta}), \quad \theta \in [0, 2\pi). \] After stereographic projection to \(\mathbb{R}^3\), the points are \[ \mathbf{p} = \left( \tfrac{x_1}{1 - x_4},\, \tfrac{x_2}{1 - x_4},\, \tfrac{x_3}{1 - x_4} \right). \]

Stereographic Projection

Stereographic projection from \(S^3 \subset \mathbb{R}^4\) (excluding the north pole \(N=(0,0,0,1)\)) to \(\mathbb{R}^3\) is \[ \pi(x_1, x_2, x_3, x_4) = \left( \frac{x_1}{1 - x_4},\, \frac{x_2}{1 - x_4},\, \frac{x_3}{1 - x_4} \right). \] Under this map, Hopf fibers remain circles in \(\mathbb{R}^3\).


Patterns and Examples

Some point distributions used for interesting visualizations include:
  • Icosahedral: points at the vertices of an icosahedron projected onto \(S^2\).
  • Spiral: points arranged from the north to south pole.
  • Latitude bands: points along the equator and tropics of \(S^2\).
  • Longitude bands: points along meridians of \(S^2\).
  • Equator sine: points on a wavy curve along the equator of \(S^2\).

That's it!

I hope this visualization helps you explore the Hopf fibration in a more intuitive way. This project exists thanks to the support of my Patrons. If you want to join them to support my work, you can do it with the links below:


References

  1. Behiel, R. [RichBehiel] (2023, Mar, 25). A Quick Intro to Fiber Bundles (Hopf Fibration). YouTube. https://youtu.be/dkyvZo68IoM
  2. Hopf, H. (1931). Über die Abbildungen der dreidimensionalen Sphäre auf die Kugelfläche, Mathematische Annalen, 104, no. 1, 637-665.
  3. Lyons, D. W. (2003). An Elementary Introduction to the Hopf Fibration. Mathematics Magazine, 76 (2): 87-98,
  4. Rowland, T. "Hopf Map." From MathWorld--A Wolfram Resource, created by Eric W. Weisstein.
  5. Treisman, Z. (2009). A young person's guide to the Hopf fibration.