LuxeInteriors is a responsive, dynamic website for Luxury Interior Design & Decoration Limited showcasing premium interior design services, portfolio, and team expertise. Built with React (Vite), this elegant website combines functionality with aesthetics to provide potential clients with a compelling digital experience.
- Responsive Design: Fully optimized for all devices from mobile to desktop
- Modern UI/UX: Elegant, user-friendly interface with smooth animations
- Dynamic Content: Interactive portfolio gallery with filtering capabilities
- SEO Optimized: Structured for search engine visibility
- Performance Focused: Fast loading times and optimized assets
- Comprehensive Showcase: Detailed presentation of services, projects, and team members
- Contact Integration: Functional contact form for client inquiries
The website features a warm, luxurious color palette:
- Primary (Orange): #FF7E00 - Represents creativity, enthusiasm, and warmth
- Secondary (Green): #2E8B57 - Symbolizes growth, luxury, and elegance
- White: Provides the clean canvas needed to showcase design work
- React: JavaScript library for building the user interface
- Vite: Next-generation frontend tooling for faster development
- Tailwind CSS: Utility-first CSS framework for styling
- Framer Motion: Animation library for creating smooth transitions
- Swiper.js: Touch slider for creating carousels and galleries
- React Router: For navigation and routing between pages
- React Helmet Async: For dynamic SEO management
- React Icons: For iconography throughout the site
- Formik & Yup: For form handling and validation
luxe-interiors-design/
├── public/ # Static assets
├── src/
│ ├── assets/ # Images, fonts, videos
│ ├── components/ # Reusable UI components
│ │ ├── layout/
│ │ ├── ui/
│ │ ├── sections/
│ │ └── shared/
│ ├── context/
│ ├── data/
│ ├── hooks/
│ ├── pages/
│ ├── utils/
│ ├── App.jsx
│ └── main.jsx
├── tailwind.config.js
├── vite.config.js
├── package.json
└── README.md
- Node.js (v20.0.0 or later)
- npm or yarn
- Clone the repository:
git clone https://github.com/yourusername/luxe-interiors-design.git
cd luxe-interiors-design- Install dependencies:
npm install
# or
yarn install- Start the development server:
npm run dev
# or
yarn dev-
Open your browser and navigate to http://localhost:5173
npm run build
# or
yarn build- Home - Showcases featured projects, services, and company overview
- About - Company history, mission, vision, and team introduction
- Services - Detailed information about design services offered
- Gallery - Portfolio of completed projects with filtering options
- Team - Information about the design team and their expertise
- Contact - Contact form and information for potential clients
- NotFound - Custom 404 page
View screenshots
Contributions are welcome! Please feel free to submit a Pull Request.
- Fork the repository
- Create your feature branch (
git checkout -b feature/amazing-feature) - Commit your changes (
git commit -m 'Add some amazing feature') - Push to the branch (
git push origin feature/amazing-feature) - Open a Pull Request
- Abdulhameed Shehu, CEO of MTC World, for assigning this real-world project and providing valuable guidance and support.
- Design inspiration from various luxury interior design websites
- The developers and community behind Tailwind CSS, React, Vite, Framer Motion, and other open-source tools that made this project possible.
- Project developed for Luxury Interior Design and Decoration
For any inquiries about this project, please reach out to:
- Email: [email protected]
- Website: --
- LinkedIn: Suhaib Muhammad Babangida
Designed & Developed with ❤️ for MTC WORLD