This project is a Virtual Product Customization App developed using React.js and Three.js. The app allows users to view a 3D product model, customize its color, upload custom images as textures, and generate images using AI-based text input. Additionally, users can select predefined logos or full cover designs for the product.

• 3D Product Model: Utilizes Three.js to render a 3D model of the product, providing users with an interactive and immersive experience.

• Color Customization: Users can customize the color of the 3D product model using a color picker.

• Texture Upload: Allows users to upload their own images as textures for the product model, enabling personalization.

• AI Image Generation: Integration with AI services allows users to generate images based on textual input. The app communicates with the AI service to receive generated images.

• Predefined Designs: Offers a set of predefined logos and full cover designs that users can select with a click.

• Image Download: Provides a button to download the customized product image.

• React.js: A JavaScript library for building user interfaces.

• Vite: A fast build tool enhancing the development experience for modern web projects.

• Tailwind CSS: A utility-first CSS framework to customize styles for components.

• React Color: A color picker component for React.

• Three.js: A JavaScript library for 3D graphics.

• Fiber (React Three Fiber): A reimplementation of Three.js in React, providing declarative 3D rendering.

• React Framer Motion: For animations.

• Node.js: Used to handle CORS (Cross-Origin Resource Sharing) issues.

• Volto: State management tool for the application.

  Demo

  Check out the live demo here