A highly customizable GitHub stats SVG generator
This project generates a visually appealing, highly customizable SVG image displaying GitHub user statistics. It's designed to be embedded in GitHub profiles or other web pages to showcase a user's GitHub activity and contributions.
- Fetches real-time GitHub user data using the GitHub GraphQL API
- Generates a customizable SVG image with user stats, displaying various metrics including commits, language usage, and many more
- Supports custom color schemes, configurations, and animated elements
This project is configured for deployment on Vercel. Follow these steps to deploy your own instance of the GitHub Stats SVG generator:
-
Generate a GitHub Personal Access Token (PAT):
- Go to GitHub Settings > Developer settings > Personal access tokens
- Click "Generate new token" and select the necessary scopes (at minimum,
public_repoandread:user) - Copy the generated token
-
Click the "Deploy" button below to clone and deploy the project on Vercel:
-
During the Vercel deployment process:
- Set the
GITHUB_TOKENenvironment variable with your generated PAT - Update any other necessary configuration settings
- Set the
-
After deployment, update the SVG URL in your projects or profile README:
Replace
your-vercel-deployment-urlwith your actual Vercel deployment URL andyour-github-usernamewith your GitHub username.
The vercel.json file includes the necessary settings for serverless function deployment and routing.
You can customize the appearance of the SVG by modifying the config.js file. This includes changing colors, dimensions, and other visual aspects of the generated image. If you want to modify the SVG code, you can do so in the /src/card/renderStats.js file.
Contributions are welcome! Please feel free to submit a Pull Request and open an issue. check [Intro] (intro.md) for more information.
This project is licensed under the MIT License - see the LICENSE file for details.
Enjoy showcasing your GitHub stats in cyberpunk style! 🚀
#Cyberpunk2077 #Cyberpunk:Edgerunners