Your Complete Productivity Suite - Simple, Powerful, and Free Forever
Features β’ Demo β’ Quick Start β’ Tech Stack β’ Contributing
- Overview
- Live Demo
- Features
- Tech Stack
- Quick Start
- Environment Setup
- Project Structure
- API Documentation
- Deployment
- Contributing
- Documentation
- License
ToolDeck is a modern, all-in-one web toolkit built to make productivity effortless.
It combines multiple powerful tools β AI-powered Email Generator, Universal File Converter, WhatsApp Sender, QR Code Generator, and PDF Editor β all in a sleek, responsive interface with full dark mode support.
ToolDeck is designed for clubs, teams, and individuals who want to streamline their digital workflows β from creating event emails to converting files or editing PDFs β all in one place, without downloads or installations.
- β‘ Lightning Fast β Powered by React 18 and Tailwind CSS
- π§ AI-Powered β Smart content generation using Google Gemini 2.5 Flash
- π Privacy First β File conversions happen in your browser
- π± Fully Responsive β Works perfectly on all devices
- π Dark Mode β Beautiful theme with smooth transitions
- π Completely Free β No subscriptions, no hidden costs
- π Instant Access β No downloads or installations required
π Production: https://tool-deck.vercel.app
π Backend API: https://tooldeck.onrender.com
Try it now - no signup required!
ToolDeck provides six powerful tools, each crafted to solve everyday productivity problems:
- Generate QR codes instantly from any text, link, or contact info
- Customize colors, size, and error correction level
- Download as PNG, SVG, or copy directly
- Real-time preview and responsive design
Perfect for club/event use β send messages fast without saving contacts.
- Send direct WhatsApp messages to any number instantly
- No need to save contacts
- Add delayed sending (0β60 seconds) for batch sending
- Supports international formats automatically
- Great for rush-hour communication or event coordination
Generate, personalize, and send professional emails with Google Gemini AI
- Upload an event banner image β AI analyzes it automatically
- Provide brief context (e.g., "Tech fest invitation")
- AI generates complete email content:
- Professional subject line
- Personalized greeting and body
- Strong call-to-action and closing
- Send emails directly via SMTP (Nodemailer)
- Bulk email support with CSV upload
- User credential option - send from your own email account
- Perfect for college clubs, event organizers, and teams
Powered by: Google Gemini 2.5 Flash API
Professional PDF editing powered by Tldraw
- Built with Tldraw v4.1.1 canvas and PDF.js
- Annotate, highlight, and draw directly on PDFs
- Add text, shapes, and freehand drawings
- Multi-page support with smooth navigation
- Export edited PDFs or save as images
- Zoom and pan for precise editing
- Clear canvas option to start fresh
Note: Currently renders PDFs as images for annotation. Text extraction coming soon!
Convert between any file format, seamlessly in your browser
- Supports images, documents, spreadsheets, and PDFs:
- Images: PNG β JPG β JPEG β WebP β BMP β GIF
- PDF β Images: Convert PDFs to images or images to PDF
- Documents: DOCX β TXT β HTML β PDF
- Spreadsheets: CSV β JSON β XLSX β HTML
- Drag & drop file upload interface
- Advanced quality settings and compression control
- Real-time preview before conversion
- Progress indicator for large files
- Conversion history tracking
- Runs 100% client-side (no uploads, complete privacy)
Libraries: pdf-lib, mammoth, xlsx, browser-image-compression
- Interactive hero with animated Aurora background (WebGL)
- Floating particles and smooth animations
- Stats section showing app capabilities
- Tool showcase with glass-morphism cards
- Full dark mode with smooth theme transitions
- Responsive design for all screen sizes
- SEO optimized with meta tags
| Technology | Version | Purpose |
|---|---|---|
| React | 18.2.0 | UI framework with hooks and context |
| React Router DOM | 6.30.1 | Client-side routing |
| Tailwind CSS | 3.4.18 | Utility-first CSS framework |
| PostCSS | 8.5.6 | CSS preprocessing |
| Axios | 1.13.0 | HTTP client for API calls |
| Library | Version | Purpose |
|---|---|---|
| Tldraw | 4.1.1 | Canvas-based PDF annotation |
| PDF.js | 5.4.296 | PDF parsing and rendering |
| pdf-lib | 1.17.1 | PDF manipulation and export |
| OGL | 1.0.11 | WebGL animations (Aurora) |
| qrcode.react | 4.2.0 | QR code generation |
| html2canvas | 1.4.1 | Canvas to image conversion |
| file-saver | 2.0.5 | Client-side downloads |
| mammoth | 1.11.0 | DOCX to HTML parser |
| XLSX | 0.18.5 | Excel/CSV processing |
| browser-image-compression | 2.0.2 | Image optimization |
| lucide-react | 0.259.0 | Modern icon library |
| react-scroll | 1.9.3 | Smooth scrolling |
| Technology | Version | Purpose |
|---|---|---|
| Express.js | 5.1.0 | Web server framework |
| MongoDB | Latest | NoSQL database |
| Mongoose | 8.19.1 | MongoDB ODM |
| Nodemailer | 6.9.15 | SMTP email delivery |
| Google Generative AI | 0.21.0 | Gemini API client |
| Multer | 1.4.5 | File upload middleware |
| dotenv | 17.2.3 | Environment config |
| CORS | 2.8.5 | Cross-origin requests |
- Node.js 16.x or higher
- npm or yarn
- MongoDB (local or Atlas) - optional for dev
- Gemini API Key (for AI email generation)
### Frontend Setup
```bash
# 1. Clone the repository
git clone https://github.com/yourusername/tooldeck.git
cd tooldeck
# 2. Install dependencies
npm install
# 3. Create environment file
cp .env.example .env
# 4. Configure .env
# REACT_APP_API_URL=http://localhost:5000
# 5. Start development server
npm start
# App runs on http://localhost:3000# 1. Navigate to backend folder
cd backend
# 2. Install dependencies
npm install
# 3. Create environment file
cp .env.example .env
# 4. Configure backend .env
# PORT=5000
# MONGO_URI=your_mongodb_connection_string
# GEMINI_API_KEY=your_gemini_api_key
# EMAIL_USER=your_email@gmail.com
# EMAIL_PASS=your_app_specific_password
# 5. Start backend server
npm run dev
# Backend runs on http://localhost:5000# Build frontend for production
npm run build
# Serve production build
npx serve -s build
# Or deploy to Vercel/Netlify# API Configuration
REACT_APP_API_URL=https://tooldeck.onrender.com # Production backend
# REACT_APP_API_URL=http://localhost:5000 # Development backend# Server Configuration
PORT=5000
NODE_ENV=development
FRONTEND_URL=http://localhost:3000
# Database
MONGO_URI=mongodb://localhost:27017/tooldeck
# OR use MongoDB Atlas:
# MONGO_URI=mongodb+srv://username:password@cluster.mongodb.net/tooldeck
# Google Gemini AI (Required for email generation)
GEMINI_API_KEY=your_gemini_api_key_here
# Get your key from: https://makersuite.google.com/app/apikey
# Email Configuration (Gmail SMTP)
EMAIL_USER=your_email@gmail.com
EMAIL_PASS=your_app_specific_password
# Generate app password: https://myaccount.google.com/apppasswords- README.md - Project overview and setup guide
- CODEBASE_SUMMARY.md - Comprehensive code documentation
- API_DOCUMENTATION.md - Complete API reference
- DARK_MODE_IMPLEMENTATION.md - Theme system guide
- DEPLOYMENT_FIX_GUIDE.md - Deployment troubleshooting
- Frontend: https://tool-deck.vercel.app
- Backend: https://tooldeck.onrender.com
See DEPLOYMENT_FIX_GUIDE.md for detailed instructions.
Contributions are welcome! Please follow these steps:
- Fork the repository
- Create a feature branch (
git checkout -b feature/amazing-feature) - Commit your changes (
git commit -m 'Add amazing feature') - Push to the branch (
git push origin feature/amazing-feature) - Open a Pull Request
- Follow existing code style
- Add comments for complex logic
- Test thoroughly before submitting
- Update documentation as needed
- PDF text extraction not yet implemented (renders as images)
- File size limits on some conversions
- WhatsApp API limitations (opens web.whatsapp.com)
- Add user authentication
- Implement file history/favorites
- Add more conversion formats
- Improve PDF text editing
- Add template library for emails
- Implement offline mode (PWA)
- Add keyboard shortcuts
- Implement batch operations
This project is licensed under the MIT License - see the LICENSE file for details.
Prem Saik
- GitHub: @prem22k
- LinkedIn: Your LinkedIn
- Google Gemini for AI-powered email generation
- Tldraw for the amazing canvas editor
- Tailwind CSS for the beautiful styling system
- React community for the excellent ecosystem
- All contributors and users of ToolDeck!
Made with β€οΈ by developers, for developers
β Star this repo if you find it useful! β
Report Bug β’ Request Feature β’ Documentation