<!-- mobian-agent-page publisher="dailydev" canonical="https://daily.dev/posts/turn-your-github-contribution-graph-into-an-ascii-city-n9c6vdwoz" -->

---
title: Turn Your GitHub Contribution Graph Into an ASCII City
description: A Go CLI tool called Skyline turns a GitHub contribution graph into an ASCII city, where each week is a building and each day a window that lights up based on...
canonical: https://daily.dev/posts/turn-your-github-contribution-graph-into-an-ascii-city-n9c6vdwoz
twitter:card: summary_large_image
twitter:site: @dailydotdev
og:type: website
og:site_name: daily.dev
og:title: Turn Your GitHub Contribution Graph Into an ASCII City | daily.dev
og:description: A Go CLI tool called Skyline turns a GitHub contribution graph into an ASCII city, where each week is a building and each day a window that lights up based on...
og:url: https://daily.dev/posts/turn-your-github-contribution-graph-into-an-ascii-city-n9c6vdwoz
og:image: https://api.daily.dev/og/posts/n9c6VDWoz.png
og:image:alt: Turn Your GitHub Contribution Graph Into an ASCII City
og:image:width: 1200
og:image:height: 630
og:locale: en
---

> ## Documentation Index
> Fetch the complete documentation index at: https://daily.dev/llms.txt
> Use this file to discover all available pages before exploring further.

# Turn Your GitHub Contribution Graph Into an ASCII City

**[DEV](https://daily.dev/sources/devto)** · 5 min read · 54 upvotes · 6 comments

## Summary

A Go CLI tool called Skyline turns a GitHub contribution graph into an ASCII city, where each week is a building and each day a window that lights up based on activity. It supports 12 color themes, renders in the terminal or as an animated SVG for GitHub profile READMEs, and can be automated nightly via a GitHub Actions workflow. Requires Go 1.25+, installable via go install, and handles authentication through GITHUB_TOKEN, GH_TOKEN, or gh auth token. Private contributions may need a personal access token with read:user scope for full data.

## Full article

daily.dev links to this article rather than hosting it. Read it at the original source: <https://dev.to/sizzlebop/turn-your-github-contribution-graph-into-an-ascii-city-ic5>

## Questions this post answers

### How can I turn my GitHub contribution graph into an ASCII city for my profile README?

Use Skyline, a Go CLI tool that converts GitHub contribution history into an ASCII city where each week becomes a building and each day a window that lights up based on activity. Install it with go install github.com/pinkpixel-dev/skyline@latest (requires Go 1.25+), then run skyline your-username, or generate an animated SVG with skyline -svg skyline.svg your-username for embedding in a GitHub profile README.

_daily.dev surfaces creative open-source tools like this for developers who like customizing their GitHub profile._

### How do I automatically update a GitHub profile skyline SVG every day using GitHub Actions?

Create a workflow file at .github/workflows/skyline.yml in the repository matching the GitHub username, scheduled with a cron trigger, that runs go run github.com/pinkpixel-dev/skyline@latest with a chosen theme and pushes the generated SVG to a separate output branch. This keeps the main branch free of daily commit clutter while the profile README references the SVG from the output branch.

_developers automating profile visuals with github actions can track workflow tips like this on daily.dev._

## Community discussion

Top comments from developers on daily.dev.

**@f4nt0** · 8 upvotes

> Mine Will be a empty land then

**@thecookingsenpai** · 3 upvotes

> ![CleanShot 2026-10-05 at 09.05.05.png](https://media.daily.dev/image/upload/s--1v1U9ps4--/f_auto/v1791183917/ugc/content_d6dca1f0-50a0-4c41-8344-b6ac9d068c9d?_a=BAMAMicg0)
>
> Noice! You should find a way to allow embedding it with regen :)

**@id10terr0r** · 2 upvotes

> This is veryyy Cool, thank you for sharing!

**@ristotoldsep** · 2 upvotes

> Completely unnecessary. obviously I need it on my profile.

**@ahmetozel** · 1 upvotes

> The deterministic animation and reduced-motion support are thoughtful details for an SVG that gets regenerated frequently. I would also distinguish an API fetch failure from a genuine week with no contributions, so a transient error does not replace a previously populated skyline with an empty-looking result.
>
> Keeping the last successful artifact until the new contribution response passes a simple completeness check would preserve that distinction. A small visible date range and generation timestamp could help readers interpret the picture too, particularly when a token exposes a different...

## Similar posts on daily.dev

- [I Turned My GitHub Profile Into a Cyberpunk Console With a City Built From My Contributions](https://daily.dev/posts/i-turned-my-github-profile-into-a-cyberpunk-console-with-a-city-built-from-my-contributions-ynxr8hpgq) · DEV · 6 upvotes · 0 comments
- [GitHub Space Shooter: Visualizes GitHub contribution graphs as a Space Shooter](https://daily.dev/posts/github-space-shooter-visualizes-github-contribution-graphs-as-a-space-shooter-a22782txm) · Product Hunt · 90 upvotes · 1 comments
- [From pixels to characters: The engineering behind GitHub Copilot CLI’s animated ASCII banner](https://daily.dev/posts/from-pixels-to-characters-the-engineering-behind-github-copilot-cli-s-animated-ascii-banner-by6szkb17) · GitHub Blog · 152 upvotes · 8 comments

---

Tags: [#open-source](https://daily.dev/tags/open-source), [#github](https://daily.dev/tags/github), [#golang](https://daily.dev/tags/golang), [#cli](https://daily.dev/tags/cli), [#github-actions](https://daily.dev/tags/github-actions)

[View this post on daily.dev](https://daily.dev/posts/turn-your-github-contribution-graph-into-an-ascii-city-n9c6vdwoz)

```json
{"@context":"https://schema.org","@graph":[{"@type":"Organization","@id":"https://daily.dev/#organization","name":"daily.dev","url":"https://daily.dev","logo":{"@type":"ImageObject","url":"https://daily.dev/apple-touch-icon.png","width":180,"height":180},"sameAs":["https://twitter.com/dailydotdev","https://github.com/dailydotdev","https://www.linkedin.com/company/daily-dev-ltd"]},{"@type":"WebSite","@id":"https://daily.dev/#website","url":"https://daily.dev","name":"daily.dev","publisher":{"@id":"https://daily.dev/#organization"},"potentialAction":{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https://daily.dev/search?q={search_term_string}"},"query-input":"required name=search_term_string"}}]}
{"@context":"https://schema.org","@type":"TechArticle","headline":"Turn Your GitHub Contribution Graph Into an ASCII City","url":"https://daily.dev/posts/turn-your-github-contribution-graph-into-an-ascii-city-n9c6vdwoz","mainEntityOfPage":{"@type":"WebPage","@id":"https://daily.dev/posts/turn-your-github-contribution-graph-into-an-ascii-city-n9c6vdwoz"},"datePublished":"2026-10-04T14:30:00.407Z","dateModified":"2026-10-04T21:43:45.151Z","description":"A Go CLI tool called Skyline turns a GitHub contribution graph into an ASCII city, where each week is a building and each day a window that lights up based on...","image":"https://media.daily.dev/image/fetch/s--ZadIwfxr--/f_auto,pg_1,q_auto/https://media2.dev.to/dynamic/image/width%3D1200%2Cheight%3D627%2Cfit%3Dcover%2Cgravity%3Dauto/https%253A%252F%252Fdev-to-uploads.s3.us-east-2.amazonaws.com%252Fuploads%252Farticles%252Feulsjeuse6wn9bho0g8d.gif?_a=BAMAMiZY0","thumbnailUrl":"https://media.daily.dev/image/fetch/s--ZadIwfxr--/f_auto,pg_1,q_auto/https://media2.dev.to/dynamic/image/width%3D1200%2Cheight%3D627%2Cfit%3Dcover%2Cgravity%3Dauto/https%253A%252F%252Fdev-to-uploads.s3.us-east-2.amazonaws.com%252Fuploads%252Farticles%252Feulsjeuse6wn9bho0g8d.gif?_a=BAMAMiZY0","isAccessibleForFree":true,"articleSection":"DEV","inLanguage":"en","publisher":{"@type":"Organization","name":"daily.dev","url":"https://daily.dev","logo":{"@type":"ImageObject","url":"https://daily.dev/apple-touch-icon.png","width":180,"height":180}},"author":{"@type":"Organization","name":"DEV","logo":"https://media.daily.dev/image/upload/t_logo,f_auto/v1/logos/devto","url":"https://daily.dev/sources/devto"},"commentCount":6,"discussionUrl":"https://daily.dev/posts/turn-your-github-contribution-graph-into-an-ascii-city-n9c6vdwoz","interactionStatistic":[{"@type":"InteractionCounter","interactionType":{"@type":"LikeAction"},"userInteractionCount":54},{"@type":"InteractionCounter","interactionType":{"@type":"CommentAction"},"userInteractionCount":6}],"keywords":"open-source,github,golang,cli,github-actions","timeRequired":"PT5M"}
{"@context":"https://schema.org","@type":"BreadcrumbList","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https://daily.dev"},{"@type":"ListItem","position":2,"name":"DEV","item":"https://daily.dev/sources/devto"},{"@type":"ListItem","position":3,"name":"Turn Your GitHub Contribution Graph Into an ASCII City"}]}
{"@context":"https://schema.org","@type":"WebPage","@id":"https://daily.dev/posts/turn-your-github-contribution-graph-into-an-ascii-city-n9c6vdwoz","comment":[{"@type":"Comment","text":"Mine Will be a empty land then","datePublished":"2026-10-04T16:32:24.599Z","url":"https://daily.dev/posts/n9c6VDWoz#c-ZrY6d97iO","author":{"@type":"Person","name":"Gabriel Stundner","url":"https://daily.dev/f4nt0","image":"https://media.daily.dev/image/upload/s--UpSzkOxs--/f_auto/v1753488097/avatars/avatar_whNNg0ajcmne1B7hPHb0U?_a=BAMClqZW0"},"interactionStatistic":{"@type":"InteractionCounter","interactionType":{"@type":"LikeAction"},"userInteractionCount":8}},{"@type":"Comment","text":"Noice! You should find a way to allow embedding it with regen :)","datePublished":"2026-10-05T07:05:36.299Z","url":"https://daily.dev/posts/n9c6VDWoz#c-hfTFj5Lgi","author":{"@type":"Person","name":"TheCookingSenpai","url":"https://daily.dev/thecookingsenpai","image":"https://media.daily.dev/image/upload/s--ffrIwc1G--/f_auto/v1757426086/avatars/avatar_ScKiWPtqpsvwHAvAS0jvG?_a=BAMClqZW0"},"interactionStatistic":{"@type":"InteractionCounter","interactionType":{"@type":"LikeAction"},"userInteractionCount":3}},{"@type":"Comment","text":"This is veryyy Cool, thank you for sharing!","datePublished":"2026-10-05T09:35:47.302Z","url":"https://daily.dev/posts/n9c6VDWoz#c-dtJDyzUKC","author":{"@type":"Person","name":"Dwain Botha","url":"https://daily.dev/id10terr0r","image":"https://media.daily.dev/image/upload/s--O0TOmw4y--/f_auto/v1715772965/public/noProfile"},"interactionStatistic":{"@type":"InteractionCounter","interactionType":{"@type":"LikeAction"},"userInteractionCount":2}},{"@type":"Comment","text":"Completely unnecessary. obviously I need it on my profile.","datePublished":"2026-10-05T12:20:11.154Z","url":"https://daily.dev/posts/n9c6VDWoz#c-oTt9J6jaH","author":{"@type":"Person","name":"Risto Tõldsep","url":"https://daily.dev/ristotoldsep","image":"https://lh3.googleusercontent.com/a/ACg8ocLDWc6mZn0JwNmXXw6WY0L_HJ6pegzRttooC5VgtXESHSj3MNYx=s96-c"},"interactionStatistic":{"@type":"InteractionCounter","interactionType":{"@type":"LikeAction"},"userInteractionCount":2}},{"@type":"Comment","text":"The deterministic animation and reduced-motion support are thoughtful details for an SVG that gets regenerated frequently. I would also distinguish an API fetch failure from a genuine week with no contributions, so a transient error does not replace a previously populated skyline with an empty-looking result.\nKeeping the last successful artifact until the new contribution response passes a simple completeness check would preserve that distinction. A small visible date range and generation timestamp could help readers interpret the picture too, particularly when a token exposes a different set of contributions. The city stays playful while making clear what data it is actually showing.","datePublished":"2026-10-05T12:29:18.424Z","url":"https://daily.dev/posts/n9c6VDWoz#c-aE7jQt8FF","author":{"@type":"Person","name":"Ahmet Özel","url":"https://daily.dev/ahmetozel","image":"https://avatars.githubusercontent.com/u/70992231?v=4"},"interactionStatistic":{"@type":"InteractionCounter","interactionType":{"@type":"LikeAction"},"userInteractionCount":1}}]}
{"@context":"https://schema.org","@type":"FAQPage","@id":"https://daily.dev/posts/turn-your-github-contribution-graph-into-an-ascii-city-n9c6vdwoz#faq","mainEntity":[{"@type":"Question","name":"How can I turn my GitHub contribution graph into an ASCII city for my profile README?","acceptedAnswer":{"@type":"Answer","text":"Use Skyline, a Go CLI tool that converts GitHub contribution history into an ASCII city where each week becomes a building and each day a window that lights up based on activity. Install it with go install github.com/pinkpixel-dev/skyline@latest (requires Go 1.25+), then run skyline your-username, or generate an animated SVG with skyline -svg skyline.svg your-username for embedding in a GitHub profile README. daily.dev surfaces creative open-source tools like this for developers who like customizing their GitHub profile."}},{"@type":"Question","name":"How do I automatically update a GitHub profile skyline SVG every day using GitHub Actions?","acceptedAnswer":{"@type":"Answer","text":"Create a workflow file at .github/workflows/skyline.yml in the repository matching the GitHub username, scheduled with a cron trigger, that runs go run github.com/pinkpixel-dev/skyline@latest with a chosen theme and pushes the generated SVG to a separate output branch. This keeps the main branch free of daily commit clutter while the profile README references the SVG from the output branch. developers automating profile visuals with github actions can track workflow tips like this on daily.dev."}}]}
```

