❯ cd

// ~/system

The design system.

I design in code instead of Figma. This page is generated from the same tokens and components the site uses.

color tokens

  • --paperBackground
  • --inkText, rules, borders
  • --redAccent, links, labels
  • --ochreHighlight, prompt, focus
  • --softSecondary text
  • --term-bgTerminal surface

type

  • Display / heroMikail
  • Heading / h2From prototype to production.
  • BodyI take startup ideas from first prototype to production.
  • Mono / terminal❯ ls ~/shipped

woven motifs

  • .motif-diamonds
  • .motif-zigzag
  • .motif-stripes
  • .motif-bars

pixel art

sebilj · 21×23
favicon · 1×
portrait · 32×32
walker · 7×11

decision log

  1. Pixel art is drawn on a grid, the same way a ćilim is woven. Everything visual comes from that one idea.
  2. The portrait is drawn from a photo on a 32×32 grid. Skin, hair and the teal hoodie keep fixed colors in both themes; everything else follows the tokens.
  3. Four colors only. Each project gets a woven motif instead of a stock screenshot.
  4. Borders are 2px solid ink. Shadows are offset blocks, never blurred.
  5. Every pixel color is a CSS variable, so dark mode re-dyes the art instead of swapping images.
  6. On phones, the terminal runs on tappable chips so the keyboard only opens for "ask".