react-tshirt-designer Tailwind Templates

React Tshirt Designer

React-based POD T-shirt customizer with image upload, body input, custom text, and theme switching. Built with Tailwind, Vite, and React Hook Form.

šŸ‘• T-Shirt Customizer – POD React App

This is a fully responsive single-page Print-on-Demand T-shirt Customization App built using React, Vite, Tailwind CSS, and React Hook Form. Users can upload an image, enter body details, type custom text, and switch between stylish themes using a simple shortcut.


šŸ”§ Features

  • šŸŽØ Theme Switching – Switch between 3 custom themes using Alt + Q
  • šŸ‘¤ Body Details – Enter Height (default 180cm), Weight (default 80kg), and Build (Athletic, Lean, Regular, Big)
  • šŸ–¼ļø Image Upload – Upload your own image via file picker or drag & drop (with thumbnail preview)
  • šŸ“ Text Input – Type up to 3 lines of text to be printed on the T-shirt
  • ⚔ Live Preview – See your changes update in real time
  • šŸ’” No Backend Needed – Fully static frontend, deployed via Cloudflare Pages
  • šŸ“± Fully Responsive – Optimized for desktop, tablet, and mobile

šŸ› ļø Tech Stack

  • āš›ļø React + Vite
  • šŸŽÆ React Hook Form
  • šŸŽØ Tailwind CSS
  • 🧠 AI-Assisted Code Generation & Styling Ideas (ChatGPT used as design assistant)
  • šŸŒ©ļø Deployed via Cloudflare Pages

šŸš€ Live Demo

šŸ”— https://tshirt-customizer.pages.dev


šŸ’» Local Setup

git clone https://gitlab.com/your-username/tshirt-customizer.git
cd tshirt-customizer
npm install
npm run dev

Top categories

Loading Svelte Themes