paribhandarkar

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.

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.

ghar-ki-madad

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.

portfolio

My portfolio project is a reflection of my creativity, technical skill, and unique perspective as a front end developer. I've designed every aspect of the website, from the user interface to the code, with my personal aesthetic and approach to web development in mind.

project-rice

With its focus on promoting the medicinal varieties of rice and connecting farmers with expert opinions, Staple represents an innovative and impactful approach to promoting sustainable and healthy rice farming practices.

react-form-validation

This project is a simple user registration form built using React. It includes validation for username, email, password, and confirm password fields, and provides error messages for invalid inputs. The UI is designed with CSS, featuring a background image and a clean, modern form layout.

paribhandarkar/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.

paribhandarkar/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.

paribhandarkar/ghar-ki-madad

paribhandarkar/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.

paribhandarkar/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.

paribhandarkar/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.

paribhandarkar/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.

paribhandarkar/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.

paribhandarkar/cpp-dsa

paribhandarkar/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.

paribhandarkar/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.

paribhandarkar/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.

paribhandarkar/heart-trail-animation

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

paribhandarkar/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.

paribhandarkar/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.

paribhandarkar/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.

paribhandarkar/navbar-menu

This is a responsive navbar menu with a hamburger icon that toggles the display of the menu on click. It improves user experience on different devices by hiding the menu on small screens and displaying it on larger screens.

paribhandarkar/orebi-shopping

paribhandarkar/q-a-section

This code is an HTML page with a Q&A section built using JavaScript and CSS. The HTML page includes questions and their answers which are initially hidden. The JavaScript code controls the display of the answers when the user clicks the plus/minus button, toggling the visibility of the answer text.

paribhandarkar/random-color-generator

This project dynamically generates and displays unique hex codes for 30 divs using JavaScript

paribhandarkar/random-emoji

This project fetches a list of emojis from an external API and displays a random emoji and its code upon button click. It uses JavaScript's async/await and JSON methods to handle API data

paribhandarkar/random-password-generator

This allows users to generate a random password and was made using JavaScript, HTML, and CSS

paribhandarkar/random-photos

This project is a simple webpage that displays random images from the Picsum API inside a container with a shadow effect. A button is provided to load more images to the container. It's a fun and easy way to showcase a variety of random images on a webpage.

paribhandarkar/real-time-character-counter

I created a text area with real-time character count and limit functionality using JavaScript

paribhandarkar/sidebar-menu

I created a sidebar menu using HTML, CSS, and JS. JS adds event listeners to show/hide the sidebar. It's a simple project demonstrating basic web development skills.

paribhandarkar/social-media-selector-menu

This project creates a social media selector menu using HTML, CSS, and JavaScript. Clicking the button shows a list of social media platforms and selecting one updates the button text.

paribhandarkar/tabs-section

This project is a simple tabs implementation using HTML, CSS, and JavaScript. It allows users to switch between different tabs to view different contents.

paribhandarkar/temperature-converter

Temperature converter web app using HTML, CSS, and JS to convert Celsius, Fahrenheit, and Kelvin values. Provides real-time results as users input values. Simple and user-friendly interface.

paribhandarkar/video-trailer-popup

The popup contains a video trailer of the album and a close icon to exit the popup, using HTML, CSS, and JavaScript.

paribhandarkar/weight-converter

This project is a weight converter calculator that converts pounds to kilograms. It shows an error message for invalid inputs and is a handy tool for quick weight conversions!