This template provides a minimal setup to get React working in Vite with HMR and some ESLint rules.
Currently, two official plugins are available:
If you are developing a production application, we recommend using TypeScript with type-aware lint rules enabled. Check out the TS template for information on how to integrate TypeScript and typescript-eslint
in your project.
A React-based web application that allows users to design their own t-shirt by uploading images and adding styled text. Built using modern frontend technologies like React, Tailwind CSS, and React Hook Form.
This project is a T-Shirt Customization Web Application built using ReactJS. It allows users to personalize a T-shirt by uploading an image, adding custom text (up to 3 lines), and selecting body measurements like height, weight, and build type. It provides a live preview of the design and supports keyboard shortcut-based text styling. The UI is styled with Tailwind CSS for modern responsiveness and smooth user experience.
User selects Height, Weight, Build
Uploads an image using input field (drag-and-drop supported via system)
Adds custom multi-line text (max 3 lines)
Live preview of uploaded image + text overlay
Keyboard shortcut Alt + Q changes text styling
Text styles change across 3 themes (color, font, weight, etc.)
The whole design area is responsive
Alt + Q
shortcutTool/Library | Purpose |
---|---|
ReactJS | Frontend Framework |
Tailwind CSS | Styling |
React Hook Form | Form management and validation |
useState & useEffect | React state management |