✨ Generate animated, elite GitHub README cards with multiple themes.
Drop one URL into your README — get a stunning animated card back.
|
🌸 Anime |
⚡ Cyber |
|
💜 Neon |
🍭 Kawaii |
| 🎭 Design | 🛠 Technical | 🚀 Deployment |
|---|---|---|
| Animated SVG cards | Fast Next.js API | Vercel-ready |
| 4+ unique themes | TypeScript powered | Zero-config deploy |
| Custom tags & roles | REST endpoint | Edge-compatible |
| Social links support | README markdown output | CDN cached |
✦ Animated SVG GitHub cards ✦ Custom tags & roles
✦ Multiple unique themes ✦ Social links support
✦ Live API generation ✦ README-ready markdown
✦ Fast Next.js API routes ✦ Vercel deployment support
Simply paste this one-liner into any GitHub README:
Result: A beautiful animated SVG card, rendered inline — no setup required.
<!-- Anime theme example -->
<!-- Cyber theme example -->
<!-- Neon theme example -->
| Parameter | Type | Description | Example |
|---|---|---|---|
theme |
string |
Card visual theme | anime · cyber · neon · kawaii |
name |
string |
Display name shown on card | Ghada |
initials |
string |
Avatar initials (1–2 chars) | GC |
role |
string |
Main role or title | Full Stack Developer |
tags |
string |
Comma-separated skill tags | React,Next.js,TypeScript |
github |
string |
GitHub profile URL | https://github.com/YOUR_USERNAME |
linkedin |
string |
LinkedIn profile URL | https://linkedin.com/in/... |
color |
string |
Override accent color (hex) | ff6b9d |
Tip: All parameters are URL-safe. Use
+for spaces in values.
# 1. Clone the repository
git clone https://github.com/ghada-ch/card-api.git
# 2. Navigate to project directory
cd card-api
# 3. Install dependencies
npm install
# 4. Start the development server
npm run devApp runs at http://localhost:3000
# Or via Vercel CLI
npm i -g vercel
vercel --prod
| Layer | Technology |
|---|---|
| Framework | Next.js 15 (App Router) |
| Language | TypeScript 5 |
| Card Format | Animated SVG |
| API | Next.js Route Handlers |
| Hosting | Vercel Edge Network |
| Styling | CSS-in-SVG + Keyframe Animations |
- Anime, Cyber, Neon, Kawaii themes
- Custom name, role, and tags
- Social links integration
- Vercel API deployment
- Particle effects overlay
- Glassmorphism theme
- Custom gradients via URL param
- Theme marketplace (community-contributed)
- User accounts & saved configurations
- Card analytics (view counts)
Contributions make this project grow. All help is appreciated.
# Fork → Clone → Branch → Commit → PR
git checkout -b feature/your-amazing-theme
git commit -m "feat: add glassmorphism theme"
git push origin feature/your-amazing-theme- Fork the repository
- Create your feature branch (
git checkout -b feature/AmazingFeature) - Commit your changes (
git commit -m 'feat: add AmazingFeature') - Push to the branch (
git push origin feature/AmazingFeature) - Open a Pull Request
💡 Have an idea? Open an issue — theme suggestions especially welcome.
If this project helped you, a star means the world. ✨
It keeps the project alive, motivates new themes, and helps others discover it.
Distributed under the MIT License — free to use, modify, and distribute.
See LICENSE for full details.
Ghada Chouichi
Full Stack Developer · Open Source Enthusiast
Built with 💜 by Ghada Chouichi · Powered by Next.js + Vercel