Brand Identity

IDD Stack

Every line of code, traced back to its issue.

01

Design concept

1 2 3 4
  1. 1#N, the issue reference
  2. 2Issue dot, the source of truth
  3. 3Rails = wordmark cap height
  4. 4Two directions: 0° and a 0.15 slant

SymbolThe hash is how IDD ties work together. A branch is fix/42-…, a commit ends in (#42), a PR says Closes #42. The mark makes that #N reference the brand, and puts the issue itself, as a dot, in the center cell: the single source of truth everything else is built around.

ConstructionEvery edge follows one of two directions, horizontal or a 0.15 slant, so the mark reads as engineered rather than drawn. The bars are 7 units on a 64-unit grid, and the center cell is a 14-unit square holding a 9-unit dot. At 16px, a pixel-snapped favicon redraw takes over.

ColorDark-first, like the terminal it lives in. Neon #00FF41 is reserved for the mark and for highlights (14.5:1 on #0A0A0A); it never fills a background and never sits on light surfaces (1.3:1). On light backgrounds, the mark goes monochrome #0A0A0A.

TypographyThe IDD Stack logo spells IDD in a drawn wordmark, not a typeset one: 7-unit stems match the hash bars, the D bowls are true semicircles echoing the dot, and the cap height sits exactly between the two rails, so mark and name share one grid. Inter and JetBrains Mono carry everything else, matching the site.

02

Logo variants

Primary · dark surfaces
IDD Stack primary lockup
logo-full.svg
Monochrome · light surfaces
IDD Stack monochrome black lockup
logo-black.svg
Monochrome white · dark or photo backgrounds
IDD Stack monochrome white lockup
logo-white.svg
Mark
IDD Stack mark
logo-mark.svg
App icon
IDD Stack app icon
logo-icon.svg
Wordmark
IDD Stack wordmark
logo-wordmark.svg
Favicon
IDD Stack favicon at 64px64px
IDD Stack favicon at 32px32px
IDD Stack favicon at 16px16×16px
favicon.svg
03

Color palette

#00FF41
Neon
The mark, highlights, CTAs. Never a background fill.
#0A0A0A
Base
Page background, icon tile.
#111111
Surface
Cards, elevated panels.
#262626
Border
Hairlines, tile edge.
#A1A1A1
Muted
Secondary text (7.7:1 on base).
#FAFAFA
Text
Primary text, wordmark on dark (19:1).
04

Typography

IDD Stack wordmark specimen

Custom-drawn wordmark: 7-unit stems, cap height = hash rails

Inter · 800 · headings
Every line of code, traced back to its issue.
Inter · 400 · body
GitHub issues are the single source of truth for all development work — structure, triage, resolve, and review them so any developer or AI agent can ship a tested PR.
JetBrains Mono · 600 · terminal
❯ /issue-resolver 42
05

Developer reference

Tailwind theme
colors: { brand: {
  primary: '#0A0A0A',  surface: '#111111',  border: '#262626',
  muted:   '#A1A1A1',  text:    '#FAFAFA',  accent: '#00FF41'
} },
fontFamily: {
  sans: ['Inter', 'system-ui', 'sans-serif'],
  mono: ['"JetBrains Mono"', 'ui-monospace', 'monospace']
}
Files
logo-mark.svg # canonical 64×64 mark — source of truth
logo-full.svg # 156×72 lockup for dark surfaces
logo-wordmark.svg # 77×40 drawn wordmark
logo-icon.svg # 512×512 dark app-icon tile
favicon.svg # 16×16 pixel-snapped redraw
logo-white.svg # monochrome lockup — dark / photo backgrounds
logo-black.svg # monochrome lockup — light backgrounds
brand-showcase.html # this page

@8× PNG exports sit alongside each SVG (logo-*.png, favicon.png).

Usage — README
<picture>
  <source media="(prefers-color-scheme: dark)"  srcset="assets/logo/logo-white.svg">
  <source media="(prefers-color-scheme: light)" srcset="assets/logo/logo-black.svg">
  <img src="assets/logo/logo-black.svg" alt="IDD Stack logo" height="80">
</picture>
Usage — favicon
<link rel="icon" type="image/svg+xml" href="assets/logo/favicon.svg">