A dynamic and educational JavaFX application providing an interactive way to explore the periodic table of elements with rich features for chemistry enthusiasts, students, and educators.
- Complete Periodic Table: Visual representation of all known elements with their basic properties
- Element Information: Detailed information about each element including atomic number, mass, group, and period
- Element States Visualization: Toggle between normal view and element state visualization (solid, liquid, gas, or unknown/synthetic)
- Real Element Images: View actual photographs of elements when available
- Interactive Element Drag & Drop: Drag elements to:
- Element Information Viewer: See details about a specific element
- Electron Shell Visualizer: View the electron configuration of elements
- Element Combiner: Experiment with combining elements
- Search Functionality: Quickly find elements by name or atomic number
- Element Comparison: Compare properties between any two elements
- Keyboard Shortcuts:
Ctrl+F: Quick searchCtrl+H: About application
- Java 17 or higher
- JavaFX 22 or higher
- Clone the repository:
git clone https://github.com/hasnatrasool163/InteractivePeriodicTable.git- Navigate to the project directory:
cd InteractivePeriodicTable- Build the project:
mvn clean install- Run the application:
mvn javafx:run- Click on any element to see basic information
- Right-click on an element to access additional options:
- Show Details: View comprehensive element information
- Compare with Another Element: Compare properties of two elements
- View Element Image: See a real photograph of the element
- About Application: View application information
- Click the "Show States" button to visualize elements by their physical states at room temperature
- The legend at the right indicates the color coding for each state (solid, liquid, gas, unknown/synthetic)
- Click "Hide States" to return to the standard periodic table view
- Drag any element onto the electron shell visualization area to see its electron configuration
- The visualization displays the number of electrons in each shell
- Drag elements to the combination area to experiment with element combinations
- Clear the combination area with the "Clear" button
- Enter an element name or atomic number in the search field
- Press Enter or click the "Search" button to highlight the matching element
org.htech.interactiveperiodictable/
├── controller/
│ └── PeriodicTableController.java
├── layout/
│ ├── CompoundFinder.java
│ └── Layouts.java
├── modal/
│ └── Element.java
├── utils/
│ └── UtilityMethods.java
└── resources/
├── css/
│ └── style.css
├── icons/
│ └── periodic.jpeg
└── images/
└── [element-images]
The project uses Maven for dependency management. Key dependencies include:
org.openjfx javafx-controls 17.0.6 org.openjfx javafx-fxml 17.0.6Contributions are welcome! Please feel free to submit a Pull Request.
- Fork the repository
- Create your feature branch (
git checkout -b feature/amazing-feature) - Commit your changes (
git commit -m 'Add some amazing feature') - Push to the branch (
git push origin feature/amazing-feature) - Open a Pull Request
-Inspiration from traditional periodic tables with modern interactive elements




