This project is a pixel-perfect clone of Design Declares, built entirely with React, TypeScript, and Tailwind CSS as part of a technical assignment for FitPeo.
Replicate the provided website precisely, including:
- Design & Typography: All fonts, layouts, spacing, and color accents.
- Initial Load Animation: Replicate the opening text reveal animation.
- Scrolling Animations: All content reveals, text effects, and parallax effects.
- Scrolling Behavior: Smooth scrolling and scroll snapping as per the reference.
- Responsiveness: Fully responsive, matching the original site on all devices.
- Performance: Maintain 60fps, smooth animations, and efficient rendering.
- React (with TypeScript): Component-based UI and logic.
- Tailwind CSS: Utility-first styling and responsive design.
- Framer Motion: For sophisticated animations and scroll effects.
- HTML5: Semantic markup.
- CSS3: For custom keyframes and transitions.
- Vite: Fast development and build tooling.
-
Install dependencies:
npm install # or yarn install -
Start the development server:
npm run dev # or yarn dev -
Build for production:
npm run build # or yarn build