Color and annotate the periodic table by property, group, or custom categories for study purposes.
This tool turns the 118-element periodic table into a coloring canvas for study. Pick a mode: color by a chemical property, by group, or by categories you define yourself, and the cells repaint while a legend tracks what each color means. You can also attach notes to individual elements. The surprise for most users is that no color scheme is official. Two textbooks color the same property differently, and this tool's presets are conventions, not standards, so a color means whatever the legend you generated says it means, and the same element changes color when you switch modes.
A concrete input and expected output from the current implementation.
Input
Create a custom category named Alkali metals, pick blue as its color, and assign Li, Na, K, Rb, Cs, Fr to it.
Expected output
Cells Li, Na, K, Rb, Cs, Fr render blue and carry the Alkali metals label; the legend gains one entry with a blue swatch; the other 112 elements keep the default color.
The tool colors exactly the elements you assign, so only those six cells change. The table holds 118 elements, and 118 minus 6 leaves 112 in the default color.
Property mode repaints every cell from the element's data in the tool's bundled dataset, so whole families change at once. Group mode keys colors to the table's 18 columns. Custom mode leaves cells neutral until you assign elements to categories you name, which is how you reproduce the exact convention your course or textbook uses.
Every color you apply is registered in a legend with its label and swatch, and you can attach notes to individual elements so the reason for a color travels with the cell. The legend is generated from your current assignments, so it is the authoritative key: if a cell looks blue, the legend, not the hue, is what tells you what blue means on this table.
This tool runs entirely in the browser and nothing you create is uploaded, so there is no server copy to restore from. If the page offers an explicit save or export control, use it; otherwise assume a reload clears your work and screenshot or print before closing the tab.
No. IUPAC governs the table's content, such as element names, symbols, and atomic weights, but publishers choose their own colors, which is why metals/nonmetals tables and block-colored tables both exist. Treat every scheme, including this tool's presets, as one convention among several; use custom categories if your course expects a specific look.
The example and behavioral notes were checked against the browser implementation. Standards and primary references below define the relevant format, formula, or platform behavior.
Interactive periodic table - click elements, enter quiz mode, and guess elements from their properties. Gamified learning.
Explore the periodic table with element details, properties, and category filtering.
Browse and search ASCII, Unicode, and binary character codes with copy-to-clipboard.
Test your knowledge of semantic HTML elements with quizzes and best-practice tips.
Structured typing lessons with finger placement guide. Track WPM improvement over time with localStorage persistence.
Timed multiplication drills with accuracy tracking per table (1-12). Progress chart saved across sessions.