Fully responsive UI/UX crafted for learning modern web animations and design.
- 🤖 Introduction
- ⚙️ Tech Stack
- 🔋 Features
- 🤸 Quick Start
- 🕸️ Snippets
- 🔗 Assets
- 🚀 More
All design inspiration and assets are credited to Zentry.
This project is built purely for educational purposes. It is not intended for commercial use.
Build a visually captivating, award-style website inspired by Zentry.
Features include:
- Scroll-triggered animations
- Geometric transitions
- Engaging video storytelling
- Smooth responsiveness
- 3D interactive hover effects
- React.js
- Tailwind CSS
- GSAP (GreenSock Animation Platform)
✅ Scroll-Based Animations – Engaging animations as you scroll.
✅ Clip Path Transitions – Unique geometric animations with clip-path.
✅ 3D Hover Effects – Interactive 3D card transformations.
✅ Video Storytelling – Seamless video transitions.
✅ Responsive UI/UX – Fully responsive design for all devices.
git clone https://github.com/Prince-verma56/Zentry-Awaards-clone
cd Zentry-Awaards-clone
Install Dependencies
npm install
Run the Project Locally
npm run dev
Then open:
http://localhost:5173
🕸️ Snippets
Example: components/RoundedCorners.jsx
import React from 'react'
const RoundedCorners = () => {
return (
<svg
className="invisible absolute size-0"
xmlns="http://www.w3.org/2000/svg"
>
<defs>
<filter id="flt_tag">
<feGaussianBlur in="SourceGraphic" stdDeviation="8" result="blur" />
<feColorMatrix
in="blur"
mode="matrix"
values="1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 19 -9"
result="flt_tag"
/>
<feComposite in="SourceGraphic" in2="flt_tag" operator="atop" />
</filter>
</defs>
</svg>
)
}
export default RoundedCorners
🔗 Assets
Download all project assets from:
https://drive.google.com/file/d/12hCVnanOAUmM1vzz2dTWZ_uEFGG8xDcT/view
Google Drive Link
Note: Assets and fonts belong to Zentry and are used only for learning and demonstration purposes.
If you plan to deploy this project publicly or commercially, please replace these assets with your own.