The latest articles on DEV Community by JUNG SEUNGHOON (@seuthootdev). https://dev.to/seuthootdev https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F3839330%2F5a7bb520-474e-4260-930c-58560a0c3ce6.jpeg https://dev.to/seuthootdev en JUNG SEUNGHOON Mon, 23 Mar 2026 05:53:32 +0000 https://dev.to/seuthootdev/i-built-a-terminal-style-ascii-github-stats-generator-3pk2 https://dev.to/seuthootdev/i-built-a-terminal-style-ascii-github-stats-generator-3pk2 <p>I recently built a small project that turns GitHub stats into terminal-style ASCII art.</p> <p>If you like retro vibes, terminals, or ASCII aesthetics, this might be for you.</p> <div class="ltag-github-readme-tag"> <div class="readme-overview"> <h2> <img src="https://assets.dev.to/assets/github-logo-5a155e1f9a670af7944dd5e12375bc76ed542ea80224905ecaf878b9157cdefc.svg" alt="GitHub logo"> <a href="https://github.com/seuthootDev" rel="noopener noreferrer"> seuthootDev </a> / <a href="https://github.com/seuthootDev/github-readme-insight-terminal-ascii" rel="noopener noreferrer"> github-readme-insight-terminal-ascii </a> </h2> <h3> A tool to generate terminal-style ASCII SVGs from your GitHub profile contribution data </h3> </div> <div class="ltag-github-body"> <div id="readme" class="md"> <div class="markdown-heading"> <h1 class="heading-element">GitHub README Insight Terminal ASCII</h1> </div> <p>A tool to generate <strong>terminal-style ASCII SVGs</strong> from your GitHub profile contribution data.<br> Like <a href="https://github.com/anuraghazra/github-readme-stats" rel="noopener noreferrer">github-readme-stats</a>, you can embed it in your README or GitHub profile with a single URL.</p> <ul> <li> <strong>Themes</strong>: macOS Terminal / Windows PowerShell / Ubuntu GNOME styles</li> <li> <strong>CLI</strong>: Run locally to print to terminal and save SVG</li> <li> <strong>API</strong>: Returns SVG via <code>GET /svg?user=USER&amp;theme=...</code> (default grass) or <code>GET /svg/:type?user=USER&amp;theme=...</code> </li> <li> <strong>Tooltip</strong>: Hover each cell to see date and contribution count</li> </ul> <p><strong>theme=mac</strong> — macOS Terminal (zsh)</p> <p><a rel="noopener noreferrer" href="https://github.com/seuthootDev/github-readme-insight-terminal-ascii/images/mac_style.svg"><img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fgithub.com%2FseuthootDev%2Fgithub-readme-insight-terminal-ascii%2Fimages%2Fmac_style.svg" alt="mac"></a></p> <p><strong>theme=window</strong> — Windows PowerShell</p> <p><a rel="noopener noreferrer" href="https://github.com/seuthootDev/github-readme-insight-terminal-ascii/images/window_style.svg"><img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fgithub.com%2FseuthootDev%2Fgithub-readme-insight-terminal-ascii%2Fimages%2Fwindow_style.svg" alt="window"></a></p> <p><strong>theme=ubuntu</strong> — Ubuntu GNOME Terminal</p> <p><a rel="noopener noreferrer" href="https://github.com/seuthootDev/github-readme-insight-terminal-ascii/images/ubuntu_style.svg"><img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fgithub.com%2FseuthootDev%2Fgithub-readme-insight-terminal-ascii%2Fimages%2Fubuntu_style.svg" alt="ubuntu"></a></p> <p><strong>Stats previews (mac / window / ubuntu)</strong></p> <p><a rel="noopener noreferrer" href="https://github.com/seuthootDev/github-readme-insight-terminal-ascii/images/mac_stats.svg"><img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fgithub.com%2FseuthootDev%2Fgithub-readme-insight-terminal-ascii%2Fimages%2Fmac_stats.svg" alt="mac stats"></a> <a rel="noopener noreferrer" href="https://github.com/seuthootDev/github-readme-insight-terminal-ascii/images/window_stats.svg"><img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fgithub.com%2FseuthootDev%2Fgithub-readme-insight-terminal-ascii%2Fimages%2Fwindow_stats.svg" alt="window stats"></a> <a rel="noopener noreferrer" href="https://github.com/seuthootDev/github-readme-insight-terminal-ascii/images/ubuntu_stats.svg"><img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fgithub.com%2FseuthootDev%2Fgithub-readme-insight-terminal-ascii%2Fimages%2Fubuntu_stats.svg" alt="ubuntu stats"></a></p> <p><strong>Top-language previews (mac / window / ubuntu)</strong></p> <p><a rel="noopener noreferrer" href="https://github.com/seuthootDev/github-readme-insight-terminal-ascii/images/mac_top_language.svg"><img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fgithub.com%2FseuthootDev%2Fgithub-readme-insight-terminal-ascii%2Fimages%2Fmac_top_language.svg" alt="mac top language"></a> <a rel="noopener noreferrer" href="https://github.com/seuthootDev/github-readme-insight-terminal-ascii/images/window_top_language.svg"><img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fgithub.com%2FseuthootDev%2Fgithub-readme-insight-terminal-ascii%2Fimages%2Fwindow_top_language.svg" alt="window top language"></a> <a rel="noopener noreferrer" href="https://github.com/seuthootDev/github-readme-insight-terminal-ascii/images/ubuntu_top_language.svg"><img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fgithub.com%2FseuthootDev%2Fgithub-readme-insight-terminal-ascii%2Fimages%2Fubuntu_top_language.svg" alt="ubuntu top language"></a></p> <div class="markdown-heading"> <h2 class="heading-element">Introduction</h2> </div> <ul> <li>Enter a GitHub username to fetch the <strong>last year's contribution data</strong> and render a contribution grid.</li> <li>Renders a terminal-style SVG directly in Node.js, including hover tooltips with <strong>date and contribution count</strong>.</li> <li>Each theme has a distinct terminal window style (title…</li> </ul> </div> </div> <div class="gh-btn-container"><a class="gh-btn" href="https://github.com/seuthootDev/github-readme-insight-terminal-ascii" rel="noopener noreferrer">View on GitHub</a></div> </div> <p>You can just drop it into your README like this:</p> <p><code></code></p> <p><a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fxi2d9u9ri49lyfj0hj48.gif" class="article-body-image-wrapper"><img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fxi2d9u9ri49lyfj0hj48.gif" alt=" "></a></p> <p>There are already great tools like github-readme-stats,<br> but I wanted something a bit more retro</p> <p>If you’re into this kind of style or have ideas, feel free to open an issue or PR</p> github opensource showdev sideprojects