analog-clock

In this project, I created a stylish analog clock with the Rolex logo using HTML, CSS, and JavaScript. It dynamically retrieves the time from the user's browser to accurately represent the current time. This allowed me to practice my front-end skills while learning about working with the DOM, handling user events, and creating animations.

animated-search-bar

The code creates an animated search bar using HTML, CSS, and JavaScript, with a stylish design that includes a shadow effect, magnifier and microphone icons, and a transparent input field.

auto-text-animation-effect

Auto text effect animation showcases different careers by incrementally adding characters to displayed text. Built with HTML, CSS, and JS for engaging effect.

background-image-scroll-effect

"Background image scroll effect" that changes the opacity of the image as the user scrolls down the page.

background-video

This project features a full-screen background video with a header with a play/pause button for user control. JavaScript handles user interaction and hides the preloader after video load. Demonstrates basic web development concepts with HTML, CSS, and JavaScript.

blurred-background-popup

The webpage contains a container with a background image and a button that, when clicked, displays a popup window with a blurred background.

bmi-calculator

This web app calculates BMI using height and weight inputs. It displays the BMI value and weight condition. Built using HTML, CSS, and JavaScript, it's a useful tool for quickly determining BMI and weight condition.

button-ripple-effect

Created a button with a ripple effect using HTML, CSS, and JavaScript. This adds interactivity to the webpage and uses CSS ::before pseudo-elements and transform to create the ripple circle, while JavaScript calculates the position of the user's mouse and updates the CSS custom properties used for the ripple animation.

coding-bat-python

counter

This is a basic counter app with HTML, CSS, and JS. It displays a large numerical value that can be adjusted using three buttons, and changes color based on whether it is positive, negative, or zero.

cpp-dsa

cpp-top-100-codes

This is a personal repository for storing C++ solutions to top 100 coding questions. The codes are designed for personal practice to enhance problem-solving skills and to prepare for technical interviews.

dark-mode-toggle

A dark-mode toggle effect created using HTML, CSS & JS. Also when we switch on and off, these modes are saved inside the local storage of the browser.

digital-clock

This digital clock was built using HTML, CSS, and JavaScript, with no external libraries or frameworks. The clock displays the current time with hours, minutes, and seconds, and updates in real-time. The design is sleek and minimalistic, making it easy to read and use.

double-landing-page

This project is a double landing page built using HTML, CSS, and JavaScript, featuring two split sections, with interactivity provided by modifying the split sections' width on mouse hover. The project provides a basic template for building interactive landing pages.

emoji-rating

This is a simple rating feedback project using HTML, CSS, and JavaScript. It allows users to rate a product/service using stars and provides visual feedback.

expense-tracker

This is a simple React application that allows users to track their expenses.

feedback-ui

This project is a simple feedback UI with three rating icons and a "Send Review" button. Users can select their satisfaction level and submit feedback. Once submitted, a message appears displaying the selected rating and thanking the user.

food-app

ghar-ki-madad

git_test

heart-trail-animation

A simple web animation that uses the mouse movement of the user to generate heart icons that float around the screen.

lee-appointment

loading-bar

This project is a simple loading bar animation that uses JavaScript to update the progress of the loading bar as well as display a percentage counter.

mind-bending

mini-calendar

I've created a mini calendar with a simple and minimalist design using HTML, CSS, and JavaScript. This calendar displays the current date, which is dynamically updated using JavaScript's Date object.

month-calendar

In this project, I created a simple month calendar using HTML, CSS, and JavaScript. The calendar offers a clear and concise view of the current month and is useful for planning and scheduling.

mouse-event

This project is a webpage that displays the X and Y position of the user's mouse cursor in real-time. The JavaScript code updates the values in the boxes as the user moves their mouse. This project demonstrates dynamic HTML updates with user interaction.

movie-app

multiplication-app

A simple web application that generates random multiplication problems and asks the user to solve them. The app keeps track of the user's score and updates it based on their answers. It also uses local storage to persist the score across multiple sessions.