Skip to content
@readme-SVG

Readme SVG Toolkit

An open-source toolkit of dynamic, ready-to-use SVG components to make your GitHub READMEs stand out.

Wave divider

GitHub Org License Made with ā¤ļø

SVG HTML Open Source PRs Welcome


✨ A collection of beautiful, ready-to-use components for your GitHub README files

Animated SVGs Ā· Custom badges Ā· YouTube cards Ā· Text effects Ā· And much more...



šŸš€ What is readme-SVG?

readme-SVG is an open-source toolkit for making your GitHub profile and repository READMEs stand out. Instead of a boring wall of text, spice things up with dynamically generated animations, embedded YouTube previews, typing effects, and custom visual components — all served as SVGs you can drop right into any Markdown file.

No complicated setup. Just grab a link and paste it.


šŸ“¦ Projects

✨ Features at a Glance

šŸŽØ  Animated SVG components    —  Drop into any README instantly
āŒØļø  Typing text generator      —  Dynamic typewriter effects
šŸŽ¬  YouTube video preview      —  Embed clickable video cards
🧩  More coming soon...        —  Badges, banners, stats & more

šŸ’” How to Use

Using any component from readme-SVG is dead simple:

<!-- Example: Typing animation -->
![Typing SVG](https://your-service-url/api?...)

<!-- Example: YouTube Preview -->
[![Watch on YouTube](https://your-service-url/api?video=VIDEO_ID)](https://youtu.be/VIDEO_ID)

Just visit the individual project repository for full documentation and examples.


šŸ—ŗļø Roadmap

  • Animated typing SVG generator
  • YouTube video preview badge
  • Custom stats cards
  • Animated banners & headers
  • Text effects (glitch, neon, gradient)
  • GitHub activity visualizations
  • Badge builder UI

ā¤ļø Support the Project

If you find these tools useful, consider leaving a ⭐ on GitHub or supporting the author directly:

Patreon Ko-fi Boosty

YouTube Telegram


šŸ¤ Contributing

Contributions, issues, and feature requests are welcome!

  1. Fork the relevant project repo
  2. Create your feature branch (git checkout -b feature/amazing-feature)
  3. Commit your changes (git commit -m 'Add amazing feature')
  4. Push to the branch (git push origin feature/amazing-feature)
  5. Open a Pull Request

Wave divider

Made with ā¤ļø by OstinUA

Star ⭐ the repos if they helped you!

Pinned Loading

  1. readme-SVG-typing-generator readme-SVG-typing-generator Public

    🐦Dynamically generated animated SVGs for GitHub READMEs

    JavaScript 5

  2. readme-SVG-wave-divider-generator readme-SVG-wave-divider-generator Public

    🐦Stateless HTTP API that renders customizable SVG wave dividers from URL query parameters. Deployable on Vercel.

    Python 2

  3. readme-SVG-youtube-preview readme-SVG-youtube-preview Public

    🐦SVG badge generator for YouTube videos — embed clickable video cards in any README or webpage.

    Python 3

  4. readme-SVG-custom-badge-generator readme-SVG-custom-badge-generator Public

    🐦Client-side SVG badge generator for GitHub READMEs with themes, styles, icons and color customization.

    CSS 2

  5. Contribution-Painter Contribution-Painter Public

    šŸ„‘ Paint pixel-art on your GitHub contribution graph via backdated commits. Static frontend + GitHub API.

    JavaScript 5

  6. readme-SVG-profile-bengo readme-SVG-profile-bengo Public

    🐦Dynamic GitHub profile SVG cards with multi-slide rotation, serverless API, and README embed support.

    JavaScript 1

Repositories

Showing 10 of 14 repositories

Top languages

Loading…

Most used topics

Loading…