A professional, high-performance web application to create, edit, and export custom WhatsApp stickers (static & animated) using cutting-edge AI and browser-based processing.
StickerMaker AI is a state-of-the-art web utility that brings professional-grade sticker creation to your browser. It combines the power of AI-driven image segmentation with a robust canvas editor, allowing users to transform any image or video into a high-quality WhatsApp sticker in seconds.
StickerMaker AI هو تطبيق ويب متطور يمنحك أدوات احترافية لإنشاء الملصقات مباشرة من متصفحك. يجمع التطبيق بين قوة الذكاء الاصطناعي في عزل الصور ومحرر طبقات قوي، مما يتيح لك تحويل أي صورة أو فيديو إلى ملصق واتساب عالي الجودة في ثوانٍ معدودة.
- Privacy-First AI: Powered by Transformers.js and MediaPipe, all AI processing happens locally on your device. Your data never leaves your browser.
- Precision Segmentation: Effortlessly remove backgrounds from complex images with a single click.
- Edge Refinement: Use the Smooth and Edge Offset tools to perfect the contours of your stickers.
- Video to WebP: Convert MP4, WebM, or GIF files into WhatsApp-compatible animated WebP stickers.
- High-Speed Conversion: Leverages FFmpeg.wasm for lightning-fast, client-side video processing.
- Frame Control: Automatically optimizes frame rates and quality for the best WhatsApp experience.
- Fabric.js Engine: A flexible multi-layer system where you can drag, resize, rotate, and flip any element.
- Rich Text Tools: Add text with custom fonts, colors, and thick strokes (essential for stickers!).
- Emoji Integration: Quickly add emojis from a built-in picker to enhance your creations.
- Advanced Filters: Apply Grayscale, Sepia, Invert, Brightness, and Contrast filters to individual layers.
- Manual Touch-up: Precise Brush and Eraser tools for manual fine-tuning of AI results.
- Sticker Store: Access a library of pre-built, high-quality sticker packs.
- Personal Collection: Save your personal creations in a local gallery (IndexedDB support).
- JSON Sync: Import and export your sticker packs as JSON files for backup or sharing.
- Instant Export: Export directly to
.webpformat, perfectly sized for WhatsApp (512x512).
The app is fully localized for a global audience with a smooth, responsive UI:
- Arabic (العربية): Fully optimized RTL (Right-to-Left) layout with beautiful Tajawal typography.
- English: Clean, modern LTR interface.
- Dynamic Switching: Change languages on the fly without refreshing the page.
- Framework: Vanilla HTML5, CSS3, ES6+ JavaScript.
- Canvas Library:
Fabric.jsfor complex object manipulation. - AI Processing:
Transformers.js&MediaPipe Selfie Segmentation. - Media Engine:
FFmpeg.wasmfor animated WebP generation. - Compression:
JSZipfor multi-file exports.
- Runtime:
Node.js. - File Watching:
Chokidarfor real-time sticker store synchronization. - Image Processing:
Sharpfor backend thumbnail and pack generation.
- Node.js (v16.0.0 or higher recommended).
- Clone the repository:
git clone https://github.com/yourusername/StickerMaker.git cd StickerMaker - Install dependencies (for the local server):
npm install
- Start the development server:
npm start
- Open your browser and go to
http://localhost:8080.
- Upload: Drag an image/video or click the "Import" button.
- AI Magic: Click the Wand Icon to remove the background automatically.
- Refine: Use the Smooth slider or the Eraser/Brush tools if needed.
- Decorate: Add text, filters, or emojis. Double-click text to edit.
- Export: Click Export to WhatsApp. Save the
.webpfile. - Use: Use any WhatsApp Sticker Uploader (or the web bridge) to add it to your app.
StickerMaker AI is a Progressive Web App (PWA). You can install it on your mobile device or desktop:
- Mobile: Open the site in Chrome or Safari, tap "Share" or "Menu", and select "Add to Home Screen".
- Desktop: Click the "Install" icon in the address bar.
- Offline Support: The app works offline once it has cached the initial AI models and assets.
- Author: Antigravity
- License: MIT License - Free for personal and commercial use.
- Credits:
- AI Models by Hugging Face & Google MediaPipe.
- Canvas logic by Fabric.js.
- Media processing by FFmpeg.wasm.
Crafted with ❤️ for the sticker community.