Members-only resource

The chemistry tool is available to Melbourne AI Hub members. Sign in to continue, or apply to join from the members area.

Sign in →
Members · Sciences & Tools · Chemistry

The periodic table, in your browser.

All 118 elements — click-to-detail with electron configuration, oxidation states, melting / boiling points, discoverer, and a Bohr-shell visualisation. Search by name or symbol; filter by category. The Melbourne AI Hub working premise is to leverage the sciences alongside AI to solve real-world problems — this is the chemistry instance of that toolbelt. Members-gated, but the URL is stable so any project page can link here directly, or embed the same module via <div id="mah-periodic-table"></div> + js/learning-periodic-table.js.

How to read the table

  • Each cell shows the atomic number (top-left), symbol (centre), and name (bottom). Cells colour-code by category — see the legend below the table.
  • Click any cell to open the detail panel with full properties + an interactive Bohr-shell diagram.
  • Use the search field to jump to any element by name (Hydrogen), symbol (Au), or number (79).
  • Use the category chips to isolate a single family — Halogens, Noble gases, Lanthanides, etc.
  • Inside the detail panel, the ← / → buttons walk through neighbouring elements by atomic number.

Embed it in another project

  • Drop <div id="mah-periodic-table"></div> wherever you want the table to render.
  • Add <script src="/js/learning-periodic-table.js"></script> at the bottom of the page.
  • The component auto-mounts on DOMContentLoaded. Or call MAHPeriodicTable.render(targetEl) manually for a specific container.
  • Programmatic helpers: MAHPeriodicTable.showDetail(z), MAHPeriodicTable.search(q), MAHPeriodicTable.filter(category), MAHPeriodicTable.ELEMENTS for the raw data array.

Element data sourced from IUPAC 2021 standard atomic weights, NIST reference values, and standard chemistry textbooks. Visual layout by Melbourne AI Hub. Inspired by the rigour and educational ambition of zperiod.app — entirely original implementation.