Afterglowscreensavers

Crystal Lattices Screensaver

The Crystal Lattices screensaver builds real crystal structures from their published unit cells — sodium chloride, diamond, caesium chloride and graphite — and rotates each in turn. It runs in the browser with nothing to install; press ESC to exit.

Live preview

Crystal Lattices screensaver — Same atoms. Different answer.

Press ESC to leave fullscreen. Settings are saved in your browser only.

How the Crystal Lattices screensaver works

The saver renders with three.js on your GPU. The library is vendored into this site rather than fetched from a CDN, and loads only when a 3D screensaver actually runs.

It reads measured lattice parameters from the crystallographic literature, held in the saver because the Crystallography Open Database sends no CORS headers.

The scene resizes with the window and releases its WebGL context when the saver stops, so shuffle mode and Multi-view can cycle 3D savers without exhausting the browser's context limit.

If WebGL is unavailable the saver says so on screen rather than showing an empty black box.

Unit cells: the repeating box behind a crystal

A crystal is a pattern that repeats in all three directions, and the smallest block that rebuilds the whole pattern when stacked is called the unit cell. Describing a material comes down to a few lattice parameters (edge lengths and angles) plus the positions of atoms inside the box. Sodium chloride and caesium chloride are both simple ionic crystals built from two kinds of ion, but they are arranged differently, which gives different coordination numbers: how many oppositely charged neighbours surround each ion.

In caesium chloride each caesium ion has eight chloride neighbours, and the reverse. The structure forms when the two ions are similar in size; caesium is much closer to chloride in radius than sodium is, which is why sodium chloride adopts the rock-salt arrangement with six neighbours instead.

Diamond and graphite are the textbook case of allotropes, two forms of pure carbon. In diamond each atom bonds tetrahedrally to four neighbours, a network behind its exceptional hardness. In graphite atoms sit in flat hexagonal sheets held together weakly, so layers slide over each other, which is why it marks paper. Bonds drawn in a model are a visual convention; the underlying data is atom positions, and real crystals also contain defects and thermal vibration that an idealised lattice leaves out.

A worked example

Each structure is the actual arrangement rather than a decorative lattice. Sodium chloride alternates two ion types on a cubic grid. Diamond puts every carbon at the centre of a tetrahedron of four others, which is why it is so hard. Graphite is the same element in stacked hexagonal sheets held together by almost nothing, which is why a pencil leaves a mark. Bonds are drawn between near neighbours so the network reads as a network.

Settings & tips

Frequently asked questions

Why are diamond and graphite so different?
Because they are the same atoms arranged differently. Diamond's every-carbon-bonded-four-ways network is rigid in all directions; graphite's sheets are strong internally but barely attached to each other, so they slide. The structure, not the composition, is the property.
Are the proportions right?
The relative bond lengths follow the real lattice constants, so the geometry is faithful. Atomic radii are drawn larger than scale so the structure is legible — at true scale the atoms in an ionic crystal nearly touch.
Does this need a special browser or plugin?
No. It uses WebGL, which every current desktop and mobile browser supports. Nothing is installed and no plugin is required.
Does it cost anything or need an account?
No. Every screensaver here is free, runs in the browser and needs no sign-up.
How do scientists find a crystal's structure?
Mostly by X-ray diffraction: a beam scattered by the repeating lattice produces a pattern of spots whose positions and intensities can be worked back into atom positions.
Why does caesium chloride differ from sodium chloride?
The caesium ion is far closer in size to chloride than sodium is, so the two ions can pack in a body-centred arrangement with eight neighbours each. Sodium chloride has six neighbours per ion instead.

← All Science & Research screensavers