elementari
is a toolkit for building interactive web UIs for materials science: periodic tables, 3d crystal structures (and molecules, though could use some improvements), Bohr atoms, nuclei, heatmaps, scatter plots. Itβs under active development and not yet ready for production use but we appreciate any feedback from beta testers! π
Check out some of the examples in the navigation bar above.
Care was taken to make this interactive periodic table responsive to different screen sizes, automatically adjusting font size and what data to show or hide based on available space.
The 3d structure viewer is built on the declarative Svelte THREE.js wrapper threlte
. It gets Svelte-compiled for great performance (even on supercells with 100+ atoms), is split up into Bond
, Lattice
, Scene
and Site
components for easy extensibility. You can pass various click, drag and touch event handlers for rich interactivity as well as inject custom HTML into tooltips using child components. This one shows the Materials Project structure for mp-756175.