BeautyWorld is a modern front-end cosmetics website built with React, Next.js, TypeScript, Tailwind CSS, Framer Motion, and React Icons.
The project showcases polished UI, interactive cards, and smooth animations for a luxurious user experience.
- Landing page with Hero section, video background, and animated buttons
- Brands section with multiple cosmetic brands, hover animations, and blur effects
- Products section with interactive cards and responsive Swiper carousel
- Testimonials section with Glassmorphism cards and smooth entry animations
- Newsletter subscription with glass-style input, animated button, and background glow
- Fully responsive design for mobile, tablet, and desktop
- Smooth animations using Framer Motion
- Modern UI with gradients, hover effects, rounded cards, and shadows
- Professional Header with hamburger menu and Footer with social icons
| Technology | Purpose |
|---|---|
| ⚛️ React | Build interactive UI components |
| 🧭 Next.js | Routing and server-side rendering |
| 🟦 TypeScript | Type safety and maintainable code |
| 🎨 Tailwind CSS | Responsive styling and modern UI |
| 🪄 Framer Motion | Smooth animations and transitions |
| 🛠️ React Icons | Scalable vector icons |
Users can:
- Browse cosmetic brands with interactive hover animations
- Explore top products in Swiper carousel
- Read testimonials with modern Glassmorphism cards
- Subscribe to newsletter via stylish input section
- Navigate all sections seamlessly with responsive header and footer
Project highlights:
- Clean, modern, and responsive UI
- Interactive animations using Framer Motion
- Professional front-end architecture with React, Next.js, TypeScript
- Fully responsive design across all devices
Developed by: Toma Kawaguchi
💬 Front-End Developer | Focused on modern, interactive web projects