Love is in the air, and what better way to celebrate it than with a fun, interactive love quiz? But waitโthis isn't your regular "type-your-names-get-a-random-love-score" quiz!
I wanted something more... celestial. โจ
๐ Inspiration
Love and astrology have always been intertwined. People look to the stars for guidance in their relationships, so I thoughtโ why not blend zodiac compatibility with romance and make a quiz out of it โบ๏ธ๐?
And thus, this Celestial Love Quiz was born! ๐ฅฐ๐ซ๐ผ๐ป
This web app asks for two people's dates of birth, calculates their astrological signs, and then determines how well they match based on their celestial compatibility. Instead of just a boring number, I also wanted to make it more story-driven, so each couple gets a unique great love story from the stars. ๐
A magical web application that calculates cosmic compatibility between two people based on their names and birthdates. Experience the mystical journey of discovering your celestial love destiny!
๐ฉ๐ปโ๐ฌ๐ฉ๐ปโ๐ป๐ฉ๐ปโ๐จ๐ค My Journey โ A Tale of Curiosity, Chaos, Grit & Glory ๐ป๐
Bringing this project to life was a rollercoaster of code, creativity, and a lot of trial & error! ๐ But here are some of the coolest things I learned and built along the way:
โจ 1. A Sky Full of Stars
I wanted the background to be more than just a static image. It had to feel alive, representing the night sky, in all its glory ๐ซ๐โจ
So, I created a dynamic starry night where stars:
Twinkle in different colors
Move at different speeds
Vary in size to represent depth
It wasnโt easy, but it turned out great. โบ๏ธโบ๏ธ
โโโ 2. Zodiac Matchmaking โ The Cosmic Connection
Finding zodiac signs from a date of birth? Easy ๐๐
I researched zodiac compatibility and created a system that assigns love scores based on the harmony between signs(not really, it was random scoring ๐ ๐).
While planetary positions matter more than just the date, this was a fun way to create a dreamy, astrology-based love quiz.
๐ 3. AI-Generated Love Stories (The Unexpected Twist)
Originally, I wanted the love stories to be AI-generated in real time, but... ๐ญ the Gemini API ghosted me sometimes, leaving some results empty.
So, I pre-generated the love stories using AI, then curated them to ensure each story felt romantic and celestial. Now, every couple gets a beautifully written love tale! ๐
โค๏ธ๐ฉท๐งก๐ 4. Love in Living Colors ๐๐๐ฉต๐
Different love scores = different colored hearts.
This subtle touch makes the quiz results feel more alive and personal. Every love story gets the color it deserves.
๐ 5. Share the Love!
What's the fun in taking a love quiz if you can't share your cosmic fate?
At the bottom of the results, I added a share button for X (ex of Twitter) so people can spread their celestial love scores with the world. ๐๐
๐ Whatโs Next?
This is just the beginning! Hereโs what I want to improve next:
โ More interactive elements โ Maybe an animation when the love score appears? ๐
โ Custom-generated love stories per couple โ Making each story even more personalized. ๐
โ More zodiac accuracy โ Factoring in more astrological details! ๐
๐ License & Open Source
This project is open-source under the MIT License!
Feel free to check out the repo, fork it, and make it even better. ๐ ๏ธโจ
Celestial Love Destiny was a fusion of code, creativity, and cosmic wonder โจ๐. From dynamic stars to celestial love stories, every detail was crafted to make love feel magical. It was a journey of learning, experimenting, and storytellingโ one that truly felt written in the stars. ๐๐
๐ Iโd love your feedback! Drop a comment, tell me what you think, and if you tried the quiz, let me know your love score! ๐
Happy coding, and may your love be as infinite as the stars! โจ๐ซ
๐ P.S. If you liked this, please give it a heart on Dev.to! It would mean the world to me. ๐๐
Divya
