Colloidal Crystal Opal (2D): Structural Color From Self-Assembly
2D cross-section of a colloidal opal: adjust sphere diameter and viewing angle and watch the live-computed Bragg-diffraction structural color shift on the close-packed lattice, with a wavelength-vs-angle chart.
This 2D companion renders a flat cross-section through a close-packed FCC colloidal opal and drives the exact same Bragg-diffraction optics as the 3D version, computed from scratch on the canvas: interplanar spacing from sphere diameter, an effective refractive index from the packing fraction and medium, and a reflected wavelength from Bragg's law that is then converted to a real displayed RGB color through a hand-written wavelength-to-RGB routine — no pigment, no lookup table, just the physics. Sweep the diameter slider to change hue, or the viewing-angle slider to watch the same lattice blue-shift its reflected color exactly as real opal iridescence does, while a live chart traces the full λ(θ) curve.
Watch monodisperse colloidal spheres self-assemble from a disordered suspension into an FCC opal lattice, with a live Bragg-diffraction readout showing the structural color shift as you tune sphere size, viewing angle and the infiltrating medium's refractive index.
2D · HTML5 Canvas 2D · 60 FPS target · runs fully client-side, no install