Dev Tartan: Deterministic Plaid from a GitHub Username

Source: Dev.to

What I Built

I built Dev Tartan, a small, dependency‑free web app that generates a deterministic tartan pattern from any GitHub username.

The idea is simple: every developer gets their own “clan” tartan. You enter a username, and the app produces a unique plaid pattern that will always be the same for that username.

Under the hood

• The username is lowercased and hashed using SHA‑256 via the Web Crypto API.
• The hash bytes are used to derive:
  • 4–6 colors from a fixed 20‑color palette inspired by traditional Scottish dyes
  • Stripe widths grouped into thin, medium, and wide bands
  • A symmetric sett constructed by mirroring the stripe sequence

The tartan is rendered as layered SVG rectangles:

• Vertical warp stripes
• Horizontal weft stripes with mix-blend-mode: multiply
• A subtle twill texture overlay

The pattern repeats across a 500 × 500 SVG canvas and can be downloaded. It’s a pure function username → tartan—same input, same output. No database, no randomness, no backend.

The entire project is a single index.html file. No build step. No dependencies.

Repository:

Demo

Live demo:

You can also generate a tartan directly via query parameters, e.g.

My Experience with GitHub Copilot CLI

I used GitHub Copilot CLI primarily as a thinking partner while building and refining the hashing and derivation logic.

In particular, it helped with:

• Translating the high‑level idea (“turn hash bytes into a tartan sett”) into concrete mapping rules.
• Iterating on modular arithmetic for color selection while avoiding duplicates.
• Structuring the symmetry logic for the reflective sett.
• Refining the SVG rendering approach (layer order, opacity, blending).
• Sanity‑checking edge cases around empty or unusual usernames.

Because the project is small and self‑contained, Copilot CLI felt most useful for rapid iteration in the terminal—explaining or refactoring small sections of logic, suggesting cleaner transformations, and reasoning about deterministic behavior. For a single‑file, zero‑dependency project, that tight feedback loop was the most noticeable benefit.

Made in Scotland from girders.

Note: I’m a GitHub employee, so I’ll rule myself out of any prizes. I’d still love the participation ribbon though!