https://github.com/psykat1116/modern_periodic_table
A Beautiful, Responsive Periodic Table Web Application made using Next JS 13, Tailwind CSS, Framer Motion, Typescript, Shadcn UI
https://github.com/psykat1116/modern_periodic_table
chemistry framer-motion jwoc jwoc2k24 modern-periodic-table nextjs13 particlejs particles periodic-table periodic-table-of-elements react-icons react-tsparticles shadcn-ui swiper-js tailwindcss typescript xss
Last synced: 5 months ago
JSON representation
A Beautiful, Responsive Periodic Table Web Application made using Next JS 13, Tailwind CSS, Framer Motion, Typescript, Shadcn UI
- Host: GitHub
- URL: https://github.com/psykat1116/modern_periodic_table
- Owner: psykat1116
- Created: 2023-10-16T15:15:38.000Z (over 2 years ago)
- Default Branch: master
- Last Pushed: 2025-10-31T15:58:03.000Z (7 months ago)
- Last Synced: 2025-10-31T17:31:21.194Z (7 months ago)
- Topics: chemistry, framer-motion, jwoc, jwoc2k24, modern-periodic-table, nextjs13, particlejs, particles, periodic-table, periodic-table-of-elements, react-icons, react-tsparticles, shadcn-ui, swiper-js, tailwindcss, typescript, xss
- Language: TypeScript
- Homepage: https://modern-periodic-table.vercel.app
- Size: 17.4 MB
- Stars: 33
- Watchers: 1
- Forks: 8
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
##
Modern Periodic Table
Welcome to the Modern Periodic Table Web Application, an innovative and immersive platform designed to provide an extensive exploration of the periodic table of elements, with a specific emphasis on all types of metals spanning every block. This website is for educational experience for individuals passionate about the diverse world of metals.
## Table of Contents
1. Introduction 📌
2. Technology Used 🚀
3. Overview ⭐
4. Contribution Guidelines 📑
5. Contributing is fun 🧡
## Introduction 📌
"Modern Periodic Table of Elements" serves as a dynamic bridge between aesthetics and knowledge, offering a comprehensive journey into the fascinating realm of metals. It caters to chemistry enthusiasts, students, and researchers, providing more than just a static presentation of elements. This application is a living, breathing resource designed to make the study of metals engaging and accessible.
## Technology Used 🚀
1. Next Js
2. Tailwid CSS
3. Framer Motion
4. Typescript
5. React Icons
## Overview ⭐
Explore the richness of metals in the periodic with detailed information and interactive features.
#### Features:
- ###### Comprehensive Metal Insight:
Dive into the details of various metal types, from alkali metals to transition metals and rare earth metals.
- ###### Interactive Interface
Navigate the periodic table effortlessly through an interactive interface.Click on specific elements to reveal comprehensive information, creating an enjoyable learning experience.
- ###### Responsive Design:
Whether you're on a desktop, tablet, or mobile device, ElementsX adapts seamlessly, ensuring an optimal viewing experience across various screen sizes.
- ###### User-Friendly Presentation:
It is designed for clarity and ease of use, making it accessible to users of all levels of expertise.
## Contribution Guidelines 📑
- Firstly add a star(⭐) in this Repository.
- Fork the Repository and create a new branch for any updates/changes/issue you are working on.
- Start Coding and do changes.
- Commit your changes
- Create a Pull Request which will be reviewed and suggestions would be added to improve it.
- Add Screenshots and updated website links to help us understand what changes is all about.
### Getting Started
```bash
git clone https://github.com/psykat1116/Modern_Periodic_Table.git
```
### Important Point
You must change the file name `Modern_Periodic_Table` to the lowercase letter of your choice before entering into the folder otherwise it will show an error. It will also show errors and problems after running the project.
```bash
cd
```
## Run the project
```bash
npm install
npm run dev
```
You Can See The Running Project in [http://localhost:3000](http://localhost:3000)
## Contributing is fun🧡
Contributions of any kind from anyone are always welcome!