FOSFORONERO LAB · MANUAL

Interactive 3D Periodic Table Manual

A practical guide to Fosforonero's interactive periodic table: element search, thematic views, 3D atomic models, data panel, and mobile controls.

Updated on May 30, 2026

1. Getting started

The initial screen shows all 118 elements. Each cell contains atomic number, symbol, name, and atomic mass. Click once to highlight an element; click the same element again to open its 3D atomic view.

  • SearchUse the search field to find an element by name, symbol, or atomic number. If there is only one match, press Enter to open it.
  • LanguageThe IT / EN selector changes language while preserving the current table state. When viewing an atom, it keeps the selected atomic number.
  • ThemeThe light/dark control changes contrast and palette. Main preferences are stored in the browser.

2. Table views

The VIEW row changes how cells are colored. Views do not change the data: they help reveal chemical and physical patterns directly on the grid.

  • CategoryHighlights alkali metals, alkaline earths, metalloids, nonmetals, halogens, noble gases, lanthanides, and actinides.
  • Physical propertiesElectronegativity, atomic radius, ionization, density, melting point, boiling point, electron affinity, and crust abundance become heatmaps.
  • State and blockShow state of matter at room temperature and electron block s, p, d, f.
  • NEGEnables the negative palette variant. It is useful when you want stronger contrast for values and categories.

3. 3D atom view

The atom view opens an interactive WebGL scene. You can rotate, zoom, and compare five historical models of the same element.

  • ThomsonRepresents the atom as a diffuse positive charge with electrons embedded in it.
  • RutherfordShows a compact nucleus and orbiting electrons. Useful for seeing the nucleus-electron separation.
  • BohrPlaces electrons into discrete energy shells. This is the clearest view for shells and configuration.
  • SommerfeldIntroduces elliptical orbits and makes the historical development of atomic models more visible.
  • QuantumMoves from trajectories to probability regions, closer to the modern idea of orbitals.

4. Scene controls

  • Real scaleIncreases the relative distance between nucleus and electrons. It is conceptually closer, but less compact.
  • SpeedControls electron animation speed.
  • StarsChanges starfield intensity or turns it off.
  • vdWShows or changes the van der Waals radius sphere style when available.
  • ↑↓Shows electron spin in Bohr, Rutherford, and Sommerfeld models.
  • NucleusHides electrons and zooms into the nucleus. Proton (Z), neutron (N), and nucleon (A) counts are shown as an overlay.
  • LatticeAvailable for solid elements with a known crystal structure. Opens an interactive 3D lattice view (FCC, BCC, HCP, diamond, simple cubic). The cube shows the unit cell at a normalised scale. Lines show visual coordination contacts, not necessarily covalent bonds.
  • MoleculesAvailable for elements with common associated molecules. Opens the 3D molecule viewer (balls-and-sticks) with formula, bonds, and bond type.
  • Orbital InspectorDisplays isolated hydrogen-like orbitals (1s, 2s, 2px/y/z, 3dz², 3dxy, 3dx²−y²). Shows wavefunction shape: lobes, radial and angular nodes, phase (teal +, rose −). Phase indicates the sign of ψ, not electric charge. Unlike the quantum view, which aggregates all subshells of the selected element.
  • Contextual legendsA compact legend appears at the bottom of the 3D view and shows the symbols for the active atomic model (shells, orbit colours, spin orientation), molecule (spheres = CPK atoms, sticks = bonds, filling or polarity mode) or lattice (cube = unit cell, lines = coordination).
  • K / °C / °FCycles the temperature unit used in the data panel. The preference is saved in the browser.
  • Temperature sliderDrag the slider between 0 K and a dynamic maximum for the selected element (min 1000 K, max 12 000 K). The badge shows the derived physical state at 1 atm: solid, liquid, gas, or unknown. Blue (melting) and red (boiling) markers on the track indicate transition thresholds when data are available. The ↺ button resets to 298.15 K (25 °C). Only physical state changes with the slider — density, radius, and other properties remain tabulated at standard conditions.
  • Fullscreen canvasThe ⊞ button at the top-right of the canvas expands the 3D scene to full width, hiding the data panel. Press ⊡ to return to the two-column layout. Works for all atomic models, the Orbital Inspector, lattice, and molecule views.
  • Orbital Inspector — collapsibleIn the Orbital Inspector view, click the panel header (name + family + ▼/▲) to expand or collapse the details. When collapsed, name and family remain visible. Useful on small screens where the panel covers part of the scene.

5. Reading the data panel

The side panel summarizes chemical and physical properties. It is designed as a quick reference, not as a replacement for a university handbook.

  • Shell configurationShows how many electrons occupy the main energy levels.
  • Oxidation statesLists common or theoretical oxidation states for reactions.
  • TemperaturesMelting and boiling points are readable in Kelvin, Celsius, or Fahrenheit when available.
  • Crystal structureFor solid elements, shows the dominant lattice with a rotating 3D unit cell diagram. Click it to open the lattice view. The cube is the unit cell at a normalised didactic scale; lines show coordination contacts, not covalent bonds.
  • MoleculesShows common molecules as clickable badges. Clicking opens the 3D viewer with formula, bonds, and bond type (covalent, polar, ionic).
  • Quantum models, p, d, f orbitals are shown with distinct colors (amber, blue, emerald, violet) and the correct angular shapes derived from hydrogen-like wave functions. To explore a single orbital with visible nodes and phase, use the Orbital Inspector.
  • DescriptionThe introductory text summarizes role, use, or behavior of the element.

6. Mobile use

On small screens the table remains usable with scrolling and zoom. To avoid accidental openings, touch selection also works in two steps.

  • Pinch to zoomExpand the grid with two fingers when cells are too small to read.
  • Single tapHighlights the element and updates the bottom hint.
  • Second tapOpens the 3D atomic view for the selected element.

7. Limits and interpretation

The table uses educational models and qualitative visualizations. Sizes, orbits, and electron clouds help explain relationships and the history of models, but they are not a complete quantum simulation.

  • Historical modelsThomson, Rutherford, Bohr, and Sommerfeld are included for historical comparison, not because they all describe the modern atom.
  • Missing dataFor some synthetic or unstable elements, some properties may be absent, estimated, or not applicable.
  • Temperature sliderThe slider only changes phase classification (solid/liquid/gas) and crystal lattice availability. Pressure assumed: 1 atm. Crystal structure, density, and other tabulated properties do not vary with temperature — full thermal datasets are not available for all 118 elements. Arsenic (As) is a special case: it sublimes at 1 atm and has no stable liquid phase.
  • Nucleus–orbit distancesDistances between the nucleus and electron orbits are educational, not physically to scale. In historical models (Bohr, Sommerfeld, Rutherford) orbits have a guaranteed minimum clearance from the visual nucleus to avoid overlaps that would make the visualization unreadable. The quantum model does not apply this constraint because electron density at the nucleus is physically correct for s orbitals.
  • SourcesThe about page lists IUPAC, NIST, PubChem, and WebElements as the main data references.

Quick questions

Is the periodic table free?

Yes. It runs in the browser with no account, install, or paywall.

Can I use it in school?

Yes, as a teaching and visual support. For official data or scientific checks, also use the sources cited on the about page.

Why are outdated atomic models included?

Because they help explain how the idea of the atom changed through the history of science.