A powerful and easy-to-use tool to generate beautiful, dynamic preview cards for WhatsApp,Youtube,Tiktok and Telegram entities. Perfect for embedding in websites, social media posts, and documentation to enhance engagement and provide rich previews.
- Dynamic Metadata: Automatically fetches and displays real-time information like profile images, names, and follower/subscriber counts for WhatsApp channels, groups, contacts, and Telegram profiles, channels, groups, and bots.
- Theme Support: Generate cards in both light and dark themes to match your website or application's aesthetic.
- Clickable Cards: Generated cards are fully clickable, directing users directly to the respective WhatsApp entity or Telegram profile.
- Easy Integration: Provides ready-to-use HTML code snippets for seamless embedding into any web page.
- Responsive Design: The generated cards and the generator interface are designed to look great on any device.
- **Custom Theme
- **Advanced Customization
This project is built using modern web technologies to ensure performance, scalability, and a great developer experience.
- Next.js (App Router) - A React framework for building full-stack web applications.
- React - A JavaScript library for building user interfaces.
- Tailwind CSS - A utility-first CSS framework for rapidly building custom designs.
- shadcn/ui - A collection of re-usable components built with Radix UI and Tailwind CSS.
- Vercel OG Image Generation - For dynamic Open Graph image generation.
- Lucide React - A collection of beautiful and customizable SVG icons.
- `jsdom` - For server-side HTML parsing (used in Telegram scraping).
(Note: Logos for technologies can be added here for better visual representation.)
Follow these steps to generate your social media cards:
Open your web browser and go to the demo site: https://social-card.kawwa.site
On the home page, you will see two options:
- WhatsApp Cards: Click "Go to WhatsApp Generator" to create cards for WhatsApp channels, groups, or contacts.
- Telegram Cards: Click "Go to Telegram Generator" to create cards for Telegram profiles, channels, groups, or bots.
- Youtube Cards: Click "Go to Youtube Generator" to create cards for Youtube profiles, channels.
- TikTok Cards: Click "Go to TikTok Generator" to create cards for TikTok profiles, channels.
- Enter WhatsApp Link or Number: On the WhatsApp Card Generator page, enter a valid WhatsApp channel link (e.g., `https://whatsapp.com/channel/0029Vb6XpB7GpLHUmeubXX0E\`), a WhatsApp group link (e.g., `https://chat.whatsapp.com/ABCDEFGHIJKLMNO\`), or a phone number (e.g., `+94729787750 Business Acc Only `).
- Select Theme: Choose between "Light" or "Dark" or "Custom" theme for your card.
- Generate: Click the "Generate Card" button.
- Preview and Copy: The generated card URL, a live preview, and ready-to-use HTML code snippets (with and without clickable functionality) will appear. You can copy the URL or HTML code to embed it wherever you need.
- Enter Telegram Username: On the Telegram Card Generator page, enter a valid Telegram username (e.g., `telegram`, `durov`, `Cyber_yakku`).
- Select Theme: Choose between "Light" or "Dark" or "Custom" theme for your card.
- Generate: Click the "Generate Card" button.
- Preview and Copy: The generated card URL, a live preview, and ready-to-use HTML code snippets (with and without clickable functionality) will appear. Copy the URL or HTML code to embed it.
- Enter YouTube Channel URL: On the YouTube Card Generator page, enter a valid YouTube channel URL (e.g.,
https://www.youtube.com/@KawdhithaNirmal). - Select Theme: Choose between "Light" or "Dark" or "Custom" theme for your card.
- Generate: Click the "Generate Card" button.
- Preview and Copy: The generated card URL, a live preview, and ready-to-use HTML code snippets (with and without clickable functionality) will appear. Copy the URL or HTML code to embed it.
- Enter TikTok Channel URL: On the TikTok Card Generator page, enter a valid TikTok channel URL (e.g.,
https://www.tiktok.com/@therock). - Select Theme: Choose between "Light" or "Dark" or "Custom" theme for your card.
- Generate: Click the "Generate Card" button.
- Preview and Copy: The generated card URL, a live preview, and ready-to-use HTML code snippets (with and without clickable functionality) will appear. Copy the URL or HTML code to embed it.
https://social-card.kawwa.site/?username=cybercy
Dark 🌚
https://social-card.kawwa.site/?username=cyberyc&theme=dark
Light 🌝
https://social-card.kawwa.site/?username=cyberyc&theme=light
🎨 Custom Theme
https://social-card.kawwa.site/api/telegram?username=cyberyc&theme=dark&bgColor=%23343232&textColor=%23ffffff&fontFamily=system-ui
<img src="https://social-card.kawwa.site/api/telegram?username=cyberyc&theme=light" alt="Telegram Profile" style="width: 300px; max-width: 100%; height: auto;" />or
| 
####### TikTok
https://social-card.kawwa.site
Contributions are welcome! If you have suggestions for improvements or new features, please open an issue or submit a pull request on the GitHub repository.
This project is licensed under the MIT License. See the LICENSE file for details.
Made with ❤️ by Kawdhitha Nirmal for the community. Member Of Cyber Yakku Tm Proudly Announced