Hey DEV Community! 👋
I’m excited to share my latest project: a GitHub Profile README Generator that helps you create a stunning, personalized README for your GitHub profile—no coding required! Whether you’re a beginner or a seasoned dev, this tool makes it easy to showcase your skills, projects, and personality.
🌟 What is the GitHub README Generator?
This is a web app that lets you visually build your GitHub profile README with:
- Live Markdown preview (just like GitHub!)
- Click-to-add skills, social links, and project highlights
- Customizable banners, badges, and analytics cards
- One-click copy, download, and email features
- 100% responsive and mobile-friendly UI
✨ Features
📝 Visual Editor
- Fill in your name, tagline, description, and more
- Add your work/projects, skills, and social links
- Select GitHub analytics cards, streaks, and trophies
🎨 Skills & Socials
- Click on skill icons to add/remove them
- Add all your social profiles with one click
👀 Live Preview
- See your README exactly as it will appear on GitHub
- Preview uses real GitHub markdown CSS for pixel-perfect accuracy
📋 Easy Export & Sharing
- Copy Markdown to clipboard
- Download as .md file
- Email your README for showcase consideration
🛠️ Tech Stack
- Frontend: React, Tailwind CSS
- Markdown Rendering: react-markdown, rehype-raw, github-markdown-css
- Email: EmailJS (optional, for showcase feature)
- Build Tool: Vite
🎁 Try It Out!
👉 Live Demo
👉 Source Code on GitHub Repo
🚦 How It Works
- Fill out your profile info, work, skills, and socials.
- Click Generate README.
- Preview your README in real time.
- Copy, download, or email your Markdown!
💡 Why I Built This
I wanted a tool that:
- Makes it easy for anyone to create a beautiful GitHub profile
- Offers a true WYSIWYG (what you see is what you get) experience
- Supports all the latest GitHub badges, cards, and analytics
- Is open source and privacy-friendly
🧑💻 Contributing
PRs and suggestions are welcome!
Check out the CONTRIBUTING.md for details.
🙏 Acknowledgements
- Inspired by rahuldkjain/gh-profile-readme-generator
- Uses github-markdown-css for accurate previews
📣 Feedback
Have ideas or find a bug?
Drop a comment below or open an issue on GitHub!
Thanks for reading!
Happy README building! 🚀
Top comments (0)