A fun, beautiful, and installable Progressive Web App (PWA) to calculate love compatibility between two people. Built with vanilla HTML, CSS, and JavaScript.
Author: MAMEDUL ISLAM
✨ Features
Modern UI/UX: Gorgeous, responsive design with a pink, gradient-based theme and a repeating heart background.
PWA Ready: Installable on any device (desktop or mobile) and works offline.
Dynamic Results: Get a unique love score based on the names entered.
Heartfelt Animations: A beautiful heart-shaped progress bar appears while calculating.
Confetti Celebration: A fun confetti explosion for scores over 33%.
-
Shareable Results:
- Download as Image: Download a clean image of your result to share anywhere.
- Share via Link: Generate a unique, shareable link that reproduces the result for others.
SEO Optimized: Meta tags and structured data for better search engine visibility.
Vanilla Stack: Built with pure HTML, CSS, and JavaScript. No frameworks, no libraries (except for
html2canvasfor image generation).
🚀 Getting Started
To get a local copy up and running, follow these simple steps.
📝 Prerequisites
You need a simple local server to run this project, as PWAs require a secure context (https or localhost).
🔌 Installation
- Clone the repo
git clone https://github.com/mamedul/love-calculator.git
- Navigate to the project directory
cd love-calculator
- Start a local server If you have Python 3 installed, you can run:
python -m http.server
Or, if you have Node.js, you can use http-server:
npx http-server
- Open in your browser
Open
http://localhost:8000(or the port specified by your server) in your browser.
🛠️ Built With
HTML5
CSS3 (with Custom Properties)
Vanilla JavaScript
html2canvas.js - For downloading the result as an image.
Service Worker API - For PWA offline capabilities.
💡 SEO & Discoverability Keywords
This project is optimized for search engines and GitHub search using the following keywords:
love-calculator, love-test, compatibility-test, pwa, progressive-web-app, vanilla-js, html-css-js, web-app, fun-project, javascript-game, relationship-calculator, couple-compatibility, seo-friendly, mobile-first.
🤝 Contributing
Contributions, issues, and feature requests are welcome! Feel free to check the issues page.
👨💻 Author & Hire
Hi! I'm Mamedul Islam, a passionate Web Developer who builds modern web applications, E-commerce, PWAs, and fast, static, dynamic, responsive websites. Specializing in WooCommerce, Wordpress, PHP, MySQL, and modern web development. Creating exceptional digital experiences since 2017.
📬 Connect With Me:
I'm open for freelance work, Woocommerce, E-commerce, Wordpress, PWA development, speed test apps, Firebase projects, websocket, PHP, MySQL and more. Hire me to bring your ideas to life with clean, modern code!
📝 License:
This project is licensed under the MIT License — feel free to use, modify, and distribute it freely.
⭐ Don't forget to star this repo if you like it!
⭐ Show Your Support
If you find this extension useful, please consider giving it a star on GitHub! Your support helps motivate further development and improvements.
Top comments (0)