Interactive Periodic Table Chemistry

Select an element

What is the Interactive Periodic Table?

Quick Answer: A fully clickable periodic table displaying 118 elements with key properties. Click any element to see details (atomic number, mass, configuration, etc.). Highlight trends like atomic radius or electronegativity using the dropdown to visually see how properties change across periods and groups.

Theory of Periodic Trends

The periodic table arranges elements by increasing atomic number, revealing periodic trends. Atomic radius decreases across a period (due to increased nuclear charge) and increases down a group (more shells). Electronegativity increases across a period and decreases down a group. Ionization energy follows a similar pattern. This tool colors elements based on the selected property, using a gradient from blue (low) to red (high) to make trends immediately visible.

Step-by-Step Examples

Example 1: Explore an Element

  1. Click on the "Fe" (Iron) tile. The detail panel shows atomic number 26, mass 55.845, configuration [Ar] 3d6 4s2, etc.
  2. Use the property dropdown to highlight electronegativity; observe Fe's moderate value among transition metals.

Example 2: View Atomic Radius Trend

  1. Select "Atomic Radius" from the highlight dropdown. Elements will be color-coded (blue for small radius, red for large).
  2. Notice the radius decrease from left to right across period 3 (Na to Ar) and increase down group 1 (Li to Fr).

Example 3: Identify Noble Gases

  1. Click on any element in Group 18 (He, Ne, Ar, etc.) to see their full configuration and note their high ionization energies.
  2. Highlight "Ionization Energy" to see the peak values for noble gases.

Frequently Asked Questions

How many elements are included?

All 118 confirmed elements from Hydrogen to Oganesson, with complete IUPAC names and symbols.

What data is shown when I click an element?

Atomic number, symbol, name, atomic mass, electron configuration, electronegativity, oxidation states, and category.

How are the property highlights generated?

Colors are assigned based on a linear scale from the minimum to maximum value of the selected property for all elements. Blue = low, red = high. Missing data for some heavy elements is omitted.

Can I see trends for superheavy elements?

Properties for very unstable elements (e.g., beyond 118) are mostly predictions; this table includes experimentally known data where available.

Is this table responsive?

Yes, the grid scrolls horizontally on small screens. Element tiles remain tappable.