A modern, fast, and responsive anime rating website that displays real-time anime rankings, live search results, and detailed views — all styled in an IMDb-inspired layout. Built with HTML, CSS, and JavaScript, this project fetches data using the Jikan API to show the latest anime details, ratings, creators, and more. Designed to be clean, interactive, and user-friendly.
- 🔍 Live Anime Search – Instantly search your favorite anime as you type. Results appear dynamically using real-time API calls.
- 🌟 Top 20 Anime Rankings – Displays a live-updated list of the top-ranked anime globally.
- 🧾 Detailed Anime Cards – Hover or click to view anime rating, synopsis, writer, airing details, and more.
- 🖥️ "Most Popular" Page – A separate page where the left section shows a scrollable list of popular anime, and the right section displays detailed info (rating, writer, story) on the selected anime, with smooth transitions and a dark hover IMDb-style layout.
- 🎨 Modern UI & Animations – Smooth transitions, clean grid-based layout, soft shadows, rounded cards, and dark overlay hover effects.
- 📱 Fully Responsive Design – Works flawlessly on desktop, tablet, and mobile.
- 🧠 Smart Detail Panel – Dynamic detail panel updates based on the selected anime with fade-in transitions and rating badges.
- HTML – Page structure and content
- CSS – Styling, transitions, and layout
- JavaScript – Logic for fetching data and updating the DOM
- Jikan API – Anime data from MyAnimeList (open-source)
- Clone the repository:
git clone https://github.com/2004pra/animeRatingWeb.git - Navigate to the project folder:
cd animeRatingWeb - Open the project in your browser by double-clicking
index.htmlor running:
start index.html
- ✅ Separate page for "Most Popular" anime
- 🔲 Dark Mode toggle
- 🔲 Genre-based filtering
- 🔲 Trailer support using YouTube API
- 🔲 Save favorites using Local Storage
This project is open-source and beginner-friendly.
Feel free to fork it, improve the UI, fix bugs, or suggest features. PRs are always welcome!
Made with 💻 by @2004pra
If you liked this project, drop a ⭐ — it really helps and keeps me going!
MIT © 2004pra
Free to use, distribute, and modify — just give credit where it's due.