Projects using CSS3 in HazroProjects using CSS3 in Hazro
Cover image for PrimeNest Realty is a demo
PrimeNest Realty is a demo real estate website I designed and developed to show clients what I can build for property businesses. Many agency sites feel cluttered and hard to use, so I focused on a clean, premium look and a simple path from search to enquiry. What’s inside: A homepage with a built-in property search (buy or rent, location, price range, type, bedrooms) Property listings for sale and for rent, with filters Buying and renting FAQs to answer common questions Neighbourhood pages (Downtown, Riverside, Oakwood) showing the homes in each area A “Sell your property” page with a simple enquiry form An About page introducing the agents Featured properties, testimonials and clear call-to-action sections The design uses a warm off-white background with navy and gold accents and elegant serif headings. The layout is consistent from page to page so visitors always know where to click. Note: all listings, agents and reviews are fictional sample content. I made this as a portfolio demo. If you want a website like this for your business, message me and I’ll build it around your brand. Skills to used Web Design Web Development UI Design UX Design Responsive Design Landing Page Design Front-End Development Real Estate Website
0
387
Cover image for VELOUR is a luxury perfume-store
VELOUR is a luxury perfume-store concept featuring a cinematic 3D entrance: the camera approaches the boutique, the doors open, and visitors discover the fragrances inside. The experience includes interactive perfume bottles, animated spray effects, a personalized scent quiz, product filtering, bottle-size selection, and a shopping bag. A complete demo checkout takes visitors through delivery details to an order-confirmation screen. Built with HTML, CSS, JavaScript, and WebGL, with responsive layouts and motion controls. This is a frontend showcase; checkout does not process real payments or orders.
6
5
442
Cover image for Product website animation using
GSAP ScrollTrigger
Product website animation using GSAP ScrollTrigger + MotionPath Built with HTML, CSS & JS Created by Muzzamil Ahmed Khan Want interactive scroll animations? DM me. Email: muzzamil.wpdev@gmail.com (mailto:muzzamil.wpdev@gmail.com)
0
177
Cover image for A little wait, a lot
A little wait, a lot of motion. 🟠 A preloader animation that counts smoothly from 0 to 100%, turning loading time into part of the experience. Built with CSS and GSAP, where even the smallest details matter. #GSAP #WebAnimation #FrontendDevelopment #CreativeCoding #WebDesign
1
66
Cover image for GymFlow is a responsive gym
GymFlow is a responsive gym website that brings membership plans, trainer profiles, and fitness tools together in a polished, easy-to-navigate interface. The website features a landing page, membership plans section, professional trainers page, statistics dashboard, BMI calculator, and admin panel. Its glassmorphism styling and responsive layouts create a consistent experience across desktop and mobile devices. Built with HTML5, CSS3, JavaScript, and Node.js.
1
113
Cover image for Built a little menu interaction
Built a little menu interaction study. When the menu opens, the main content slides away with a subtle rotation, creating that layered, almost physical transition. I also added a character-by-character roll effect to the menu links using GSAP SplitText, so the typography feels just as interactive as the layout. Nothing huge. Just experimenting with motion, timing, and small details that make an interface feel more alive. Built with GSAP, CustomEase & SplitText. #GSAP #WebAnimation #FrontendDevelopment #CreativeCoding #WebDesign #InteractionDesign #MotionDesign #FrontendDeveloper #JavaScript #Awwwards
1
79
Cover image for Gutstring — Early Access Landing
Gutstring — Early Access Landing Page My client Temi was launching a new platform called Gutstring and needed a clean landing page to collect early access signups before the official launch. The goal was simple - one page, one action. Users land on the page, click a button, enter their email and get confirmation. No distractions, no extra pages. The main challenge was the backend setup. The client wanted emails saved automatically and a thank you email sent instantly to every person who signed up, all without paying for any monthly tools or subscriptions. On the design side, the interaction needed to feel smooth and intentional. When a user clicks the Register Early button, it doesn't navigate to a new page - instead it animates and transforms directly into an email input field. Once they submit, the form fades out and a confirmation message appears on screen with a clean fade up animation. The whole experience feels seamless with no page refresh at any point. I solved the backend by building everything with Google Apps Script - completely free. When someone submits their email, it automatically saves to the client's Google Sheet and triggers a thank you email from their own email address. No Zapier, no Mailchimp, no extra costs. The result is a smooth, branded landing page with polished animations, instant success confirmation, and a fully automated backend that the client owns and controls entirely.
1
109