Skip to content

A responsive, dynamic website for Luxury Interior Design & Decoration Limited showcasing premium interior design services, portfolio, and team expertise.

License

Notifications You must be signed in to change notification settings

Suhaibmuhd01/luxe-interiors-design

Repository files navigation

LuxeInteriors - Luxury Interior Design Website

LuxeInteriors Banner

🏠 Overview

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.

GitHub license Vite React Tailwind CSS

✨ Features

  • 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

🎨 Design Highlights

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

🛠️ Technologies Used

Frontend

  • 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

📂 Project Structure

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

🚀 Getting Started

Prerequisites

  • Node.js (v20.0.0 or later)
  • npm or yarn

Installation

  1. Clone the repository:
git clone https://github.com/yourusername/luxe-interiors-design.git
cd luxe-interiors-design
  1. Install dependencies:
npm install
# or
yarn install
  1. Start the development server:
npm run dev
# or
yarn dev
  1. Open your browser and navigate to http://localhost:5173

    Building for Production

npm run build
# or
yarn build

The built files will be in the dist directory.

📱 Pages

  1. Home - Showcases featured projects, services, and company overview
  2. About - Company history, mission, vision, and team introduction
  3. Services - Detailed information about design services offered
  4. Gallery - Portfolio of completed projects with filtering options
  5. Team - Information about the design team and their expertise
  6. Contact - Contact form and information for potential clients
  7. NotFound - Custom 404 page

📸 Screenshots

View screenshots

Home Page About Page Services Page Gallery Page Team Page Contact Page

🤝 Contributing

Contributions are welcome! Please feel free to submit a Pull Request.

  1. Fork the repository
  2. Create your feature branch (git checkout -b feature/amazing-feature)
  3. Commit your changes (git commit -m 'Add some amazing feature')
  4. Push to the branch (git push origin feature/amazing-feature)
  5. Open a Pull Request

👏 Acknowledgments

  • 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

📞 Contact

For any inquiries about this project, please reach out to:


Designed & Developed with ❤️ for MTC WORLD

LuxeInteriors Logo

About

A responsive, dynamic website for Luxury Interior Design & Decoration Limited showcasing premium interior design services, portfolio, and team expertise.

Resources

License

Stars

Watchers

Forks

Packages

No packages published

Languages