Science Lab · Chemistry
The Elements
All 118 elements, and the atom inside each one. Pick any element to spin its atom in 3-D, first as a simple shell model and then as the real orbital clouds of quantum mechanics. Read its numbers, see its spectral fingerprint, compare two elements, take the quiz, print a card for the wall, and listen to the elements turned into sound.
Picture
Subshells
The periodic table
Click or tap an element to see its atom. With an element selected, the arrow keys move across the table. La and Ac sit in group 3 here, as on the Chemistry Ladder; some tables put Lu and Lr there instead.
All about it
Compare two elements
Element quiz
Ten questions: find elements on the table from their names or from clues, and name their group, block and family. Pick a level and press Start a round.
Element sounds
These are artistic mappings: atoms don’t make sounds. Each mode turns real numbers about the element into tones you can hear.
Spectrum chord. Every visible line sounds at once. A line’s light wave vibrates hundreds of trillions of times a second; dividing by 240 moves it exactly 40 octaves down, into the range of a voice, and keeps the musical spacing between the lines. Brighter lines are louder. This is the idea W. Walker Smith presented to the American Chemical Society in 2023, and Jill Linz’s Atom Music at Skidmore College works the same way.
Spectrum arpeggio. The same tones one at a time, from red (lowest) to violet (highest), each plucked and dying away like a string, as in Linz’s atom tones and the melodies Smith drew from the lines.
Electron melody. One piano note for each subshell, in the order electrons fill them. The shell number picks the note of the scale: shell 1 is do, shell 2 is re, up to shell 7, ti. A subshell with more electrons is a longer note. The idea comes from Sam Zhang’s 2006 article “Teaching Electron Configuration the Musical Way.”
The first musical table. In 1865 John Newlands noticed that, listed by weight, every eighth element seemed to repeat the first, like the eighth note of a musical octave. His “law of octaves” was laughed at, but it was an early glimpse of the periodic law. Sweep a group to hear elements of one family one after another.
Printable cards
A one-page card for the element you’ve picked, or a full color periodic table for the wall. Both print sharp at any size.
The wall table prints sideways (landscape). For a bigger poster, print it at “fit to page” on larger paper.
What you’re seeing
The shell model is the picture most of us first learn: a nucleus of protons (red) and neutrons (gray) in the middle, and electrons (blue) on rings around it. The number on each ring is how many electrons that shell holds. It is good for counting, and it shows why the table has rows: a new row starts each time a new shell starts to fill. But it is not to scale. If the atom were as wide as a football stadium, the nucleus would be a pea in the middle.
Electrons don’t orbit like planets. An electron has no path at all. Quantum mechanics only tells us how likely we are to find it in each spot, and that gives a fuzzy cloud called an orbital. In the Orbitals picture, each dot is a place the electron could be found: where the dots are thick, it is often there. Two colors mark the two signs of the electron’s wave, which matter when atoms bond.
The shapes have names. An s orbital is a ball. Each p orbital is a pair of lobes along one axis (px, py, pz). The five d orbitals are mostly four-leaf clovers, and the seven f orbitals are more lobed still. Choose Side by side to see one subshell’s orbitals spread out, and tap any cloud to read its name and how many electrons it holds.
A full subshell is round. Put all three p orbitals together, or all five d orbitals, and the lobes fill each other in to make a sphere. That is why All together looks like nested fuzzy balls for most atoms: atoms really are close to round.
The science
Filling order
Electrons fill subshells from the lowest energy up. A handy rule, the Madelung rule (or Aufbau order), sorts the subshells by n + l, and by n when there’s a tie:
Here n is the shell number and l is 0, 1, 2, 3 for s, p, d, f. About twenty elements break the rule a little. Chromium is [Ar] 3d5 4s1, not 3d4 4s2, and copper is [Ar] 3d10 4s1. The page uses each element’s measured configuration and marks the exceptions.
Where the shapes come from
For hydrogen, the Schrödinger equation can be solved exactly. Each orbital is a radial part times an angular part:
The angular part, a real spherical harmonic, gives the shape: the s, p, d and f lobes. The radial part sets the size and adds n − l − 1 round nodes, shells where the electron is never found. The chance of finding the electron near a point is |ψ|², and the dots are drawn at random with exactly that chance.
Sizes, roughly
In a bigger atom each electron is pulled by the nucleus but pushed by the other electrons, so it feels a smaller effective nuclear charge. In 1930 John Slater gave simple rules to estimate it. For iron’s 4s electrons:
Each orbital here uses a hydrogen-like shape, sized so its average radius matches Slater’s estimate. That is an approximation: real many-electron orbitals are close to these shapes, but their sizes differ somewhat, and heavy atoms also feel effects from relativity.
Spectral fingerprints
When an atom’s electron drops from a higher energy level to a lower one, the atom gives off light of one exact color. Each element has its own set of levels, so each has its own pattern of bright lines, as personal as a fingerprint. Astronomers read these lines in starlight to learn what stars are made of; helium was found in the Sun’s spectrum in 1868, before anyone found it on Earth.
Try this
Learn more
- Groups, Periods and Families · Electron Configurations · Sublevels and Orbitals · Bright-Line Spectra on the Chemistry Ladder
- Quantum Numbers · Hydrogen’s Energy Levels · Configurations of Ions and Exceptions in General Chemistry 1
- Build an Atom: put protons, neutrons and electrons together yourself, and watch nuclei decay.
How it works
The orbitals. For each occupied subshell the page computes Slater’s effective charge, then draws points from the hydrogen-like |ψ|² for every occupied orbital: the distance from the radial probability r²R², the direction from |Ylm|² by accepting or rejecting random directions. Each electron gets the same number of points, so a pair of electrons makes a denser cloud. The dots are drawn with the browser’s WebGL, or on a plain canvas if WebGL isn’t available.
The nucleus uses the most common isotope in nature, or the longest-lived one for elements with none. Its protons and neutrons are packed as balls in a sphere whose volume grows with the number of particles, as a real nucleus does.
Colors of light. Each spectral line is colored from the CIE 1931 color-matching functions (in the fit by Wyman, Sloan and Shirley) converted to screen colors. Pure spectral colors are more vivid than any screen can show, so these are the nearest a screen can do, dimmed toward the ends of the visible range where the eye is less sensitive.
The sounds use the site’s own small synthesizer, with nothing recorded. A line at 656.3 nm (hydrogen’s red line) has a frequency of 456.7 trillion hertz; divided by 240 that is 415.3 Hz, close to the G♯ above middle C.
How it was checked
| Test | Result |
|---|---|
| All 22 radial functions up to n = 7, l = 3, integrated (∫R²r² dr), and their average radius | 1 within 10−12; ⟨r⟩ as the formula says |
| All 16 real spherical harmonics, s to f, integrated over the sphere against each other | 1 for the same one, 0 for two different ones, within 10−5 |
| Nodes: sign changes along r, from pole to pole, and around the sphere | n − l − 1, l − |m| and 2|m|, every time |
| 40,000 random points for a 2pz electron: average distance, and the share of ⟨z²⟩ in ⟨r²⟩ | within 2% of ⟨r⟩; 0.60 (exactly 3/5 expected) |
| Electrons in each element’s configuration and shells, all 118 | add up to Z every time |
| Configurations the Madelung order gets wrong | exactly the 20 marked exceptions: Cr, Cu, Nb, Mo, Ru, Rh, Pd, Ag, La, Ce, Gd, Pt, Au, Ac, Th, Pa, U, Np, Cm, Lr |
| Slater’s rules, textbook examples (N 2p, Zn 3d and 4s) | 3.90, 8.85, 4.35 |
| Wavelength colors: 405, 450, 530, 580 and 650 nm | violet, blue, green, yellow-orange, red |
| Sounds: hydrogen’s red line; every chord, arpeggio and melody for all 118 elements | 415.3 Hz (G♯4); chords never too loud, arpeggios climb from red to violet, one note per subshell |
Sources
- Configurations. NIST Atomic Spectra Database, ground levels of the neutral atoms (exceptions to Madelung filling as measured; Rf onward predicted).
- Crust. CRC Handbook of Chemistry and Physics, "Abundance of elements in the earth's crust and in the sea", via Wikipedia's "Abundances of the elements (data page)", cross-checked with a second listed source.
- Discovery. Element articles and "Timeline of chemical element discoveries" on Wikipedia, with IUPAC/IUPAP Joint Working Party reports for the superheavy elements.
- En. Revised Pauling electronegativities (A. L. Allred, 1961) as tabulated in the CRC Handbook; same values as the site's Chemistry Ladder.
- Half lives. Longest-lived isotopes: Wikipedia, "List of elements by stability of isotopes" (NUBASE2020 values); seaborgium and hassium from "Isotopes of seaborgium" and "Isotopes of hassium"; half-lives of naturally radioactive isotopes from Wikipedia, "List of nuclides".
- Ie1. NIST Atomic Spectra Database, "Ground levels and ionization energies for the neutral atoms" (physics.nist.gov/cgi-bin/ASD/ie.pl), fetched 2026-10-20.
- Isotopes. NIST Atomic Weights and Isotopic Compositions (IUPAC representative isotopic compositions), physics.nist.gov.
- Physical. Melting point, boiling point, density and state: Wikipedia, "List of chemical elements" (values from the CRC Handbook of Chemistry and Physics and the element articles), cross-checked against the CRC rows of Wikipedia's data pages for melting points, boiling points and densities; differences over 3% (5% for density) are noted.
- Radius. B. Cordero et al., "Covalent radii revisited", Dalton Trans. 2008, 2832; same table as the site's Chemistry Ladder.
- Spectra. NIST Handbook of Basic Atomic Spectroscopic Data (J. E. Sansonetti and W. C. Martin, NIST), strong-line tables, neutral-atom (I) lines 380–750 nm in air, with NIST's relative intensities; spot-checked against the NIST pages.
- Text. Names, uses, facts and safety notes written for the Teddy Rook Book from the element articles on Wikipedia and USGS mineral commodity summaries; reviewed for accuracy.
- Weights. IUPAC/CIAAW standard atomic weights 2021 (Prohaska et al., Pure Appl. Chem. 94, 573, 2022), as listed on iupac.qmul.ac.uk/AtWt; intervals shown as conventional values. Mass numbers in brackets: longest-lived isotope (see halfLives).
- J. C. Slater, “Atomic Shielding Constants,” Physical Review 36, 57 (1930): effective nuclear charges.
- OpenStax, Chemistry 2e: 6.3 Development of Quantum Theory and 6.4 Electron Configurations.
- C. Wyman, P.-P. Sloan and P. Shirley, “Simple Analytic Approximations to the CIE XYZ Color Matching Functions,” Journal of Computer Graphics Techniques 2, 1 (2013).
- W. Walker Smith, sonified periodic table presented at ACS Spring 2023: “Elemental music” (phys.org, March 2023).
- Jill Linz and Christian Howat, Skidmore College, Atom Music and Atom Tones: “Making Music from Atoms” (Physics, 2023) and “Composing atom music” (Physics Today, 2019).
- Sam Zhang, “Teaching Electron Configuration the Musical Way,” International Journal of Engineering Education 22, 951 (2006).
- John Newlands’ law of octaves (1865): John Newlands on Wikipedia.