GitIntro

Create beautiful GitHub profile READMEs in minutes.

GitIntro is a modern web app with professionally designed templates, real-time preview, and one-click markdown export — so your GitHub profile actually reflects who you are.

---

What it does

Writing a good GitHub profile README is tedious. GitIntro gives you 6 professional templates, an interactive editor with live preview, and a tech stack selector with auto-complete — so you go from blank to polished in under 5 minutes.

---

Features

• 6 Professional Templates — Minimalist Dev, Portfolio Showcase, Technical Writer, Indie Hacker, Social Connector, Blank Canvas
• Interactive Editor — Side-by-side editing with real-time markdown preview
• Tech Stack Selector — Add technology badges with auto-complete search
• GitHub Stats Integration — Stat cards and activity graphs, toggle on/off
• Dark / Light Mode — Seamless theme switching
• Auto-save Drafts — Progress saved to local storage automatically
• One-Click Copy — Copy generated markdown instantly
• Direct Download — Export as README.md
• Fully Responsive — Works on all screen sizes

---

Tech Stack

Framework	React 19 + TypeScript
Build	Vite
Styling	Tailwind CSS 4 + Framer Motion
UI	Radix UI primitives
Routing	React Router DOM
State	React Hooks + Custom Hooks
Markdown	@uiw/react-markdown-preview
Icons	Lucide React + Tabler Icons

---

Getting Started

# Clone the repo
git clone https://github.com/Akai771/GitIntro.git

# Navigate to project
cd gitintro/grm

# Install dependencies
npm install

# Start dev server
npm run dev

Available Scripts

Command	Description
npm run dev	Start dev server at http://localhost:5173
npm run build	Production build
npm run preview	Preview production build
npm run lint	Run ESLint

---

Usage

1. Choose a template — browse 6 professionally designed layouts
2. Customize content — fill in your info via the form editor
3. Select tech stack — add skill badges with the auto-complete selector
4. Enable stats — toggle GitHub stats cards and activity graphs
5. Preview live — see your README update as you type
6. Copy or download — get your markdown with one click

---

Template Gallery

Template	Description	Best For
Minimalist Dev	Clean, text-focused layout	Backend devs, minimalists
Portfolio Showcase	Visual-heavy design	Frontend devs, designers
Technical Writer	Documentation-oriented	Content creators, educators
Indie Hacker	Product and revenue focused	Entrepreneurs, indie makers
Social Connector	Social media hub	Community builders
Blank Canvas	Start from scratch	Advanced users, unique layouts

---

Contributing

1. Fork the repository
2. Create a feature branch — git checkout -b feature/FeatureName
3. Commit your changes — git commit -m 'Add FeatureName'
4. Push to branch — git push origin feature/FeatureName
5. Open a Pull Request

---

Acknowledgments

• Shields.io — Badge generation
• GitHub Readme Stats — GitHub statistics
• Radix UI — Accessible UI components
• Lucide — Icons

---

License

MIT — see LICENSE for details.

---

_{Built by Akai}