# godspeed / identity 01

An opinionated, calm, fast project-management tool for small product teams. First studio: Vimaksh, with Paryatech, Vaat and Sachit. The name is a wish for a fast, successful journey. The identity expresses useful momentum, clear attention and trust.

## Selected mark: Momentum

The check ends in a horizontal continuation. Completion makes room for the next step. A single filled silhouette, built from a 4-unit stroke envelope on a 32-unit canvas, has consistent diagonal and horizontal thickness, 2-unit end radii and an optically raised center. No orbit, rocket, bolt, mascot or speed streak is needed. The two other concepts and their rationales are in `concepts/`.

## Logo use

Use supplied outlined SVGs; fonts are not required to render them. Horizontal is the default. Stacked is for centered covers; mark-only is for favicon/app/avatar. The optional .wtf lockup belongs to marketing only. “godspeed” is the product name in all product UI and transactional email.

Clear space: measure X as one quarter of the 32-unit mark canvas (8 units); keep ≥X outside the entire lockup’s ink bounds. Horizontal internal gap is already fixed; do not re-typeset or alter it. Min digital mark size 16px; use 16/24/32 exports at exact CSS sizes on DPR1 and integer multiples on DPR2/3. Small mark thicknesses are 2/3/4px with a 1/1.5/2px radius respectively. Diagonals use normal antialiasing; they cannot all sit on orthogonal pixel edges. The 16px variant shifts −0.5px in x and +0.5px in y; the 24px variant shifts +0.25px in both axes. Right terminal and horizontal edges align to whole pixels at16/32 and half-pixels at24, preserving the 2/3/4px weights. Horizontal min-height 24px (about130px wide), stacked min-width100px, wordmark-only min-height20px; suffix lockup min-height32px to keep .wtf readable. Print mark min4mm, horizontal min30mm wide, stacked min25mm wide, suffix min40mm wide. Do not stretch, outline, rotate or add shadows. Monochrome currentColor assets inherit foreground; dark assets are for dark surfaces. Use blue700 on white, blue300 on dark, or a single neutral foreground. Never use pale blue text on white.

## Palette & accessibility

Blue300 #94d1f7 is the primary fill: it carries the light-blue personality and takes neutral950 text. Blue700 #17638f is the light-theme link/brand ink. Cool graphite neutrals establish precision without the hard black of a developer console. Dark uses graphite950, not pure black. Tertiary remains AA-readable; do not reduce text opacity. Decorative borders may be subtle; meaningful input boundaries use border-strong. Use a 2px focus ring with 2px offset so it sits against the surrounding surface, including for blue buttons. Text pair audit is in reports/contrast.md/json; primitives are not unrestricted text options.

Statuses always include a shape and a readable name: outlined circle / TODO; play triangle / IN PROGRESS; diamond / IN REVIEW; checked circle / DONE; crossed square / CANCELLED; paused octagon / BLOCKED. Warning is amber; review is muted iris; danger is rose. Never encode status with color alone. Project colors are categorical backgrounds with graphite initials or distinct project icons plus full project names; do not rely on blue-vs-teal or sage-vs-coral discrimination. First assignment: Paryatech sky, Vaat sage, Sachit ochre. The remaining five colors are available for future projects; they convey no semantic priority.

## Typography

Manrope Variable throughout (Mikhail Sharanda / Mirko Velimirovic; SIL OFL1.1). Warm circular forms and its open single-storey g distinguish it from default Inter. UI 14/21 regular; dense rows 13/20 regular. Labels13/18 semibold; caption12/16 medium only for auxiliary text; never shrink task body below13px. Headings16/24 and20/28 semibold; page title28/36 semibold. Marketing display48/54 semibold; scale to72/78 on large covers. Weights400,500,600; 700 only for exceptional emphasis. UI tracking0; display−0.035em. Use tabular-nums lining-nums for dates, counts, estimates and durations. Do not synthesize italics; use weight, color or quotation styling. No second display face is necessary. Wordmark is Manrope600 with optical pair spacing and supplied outline artwork.

## Iconography & motion

Use Lucide as the general icon library; standardize all icons to24 viewBox, stroke1.75, round joins/caps. At16px the stroke scales to1.17 physicalpx; at20px to1.46px; do not alternate libraries or independently change stroke weights. Six custom product icons live in assets/icons. Use icons16 in rows,20 in controls,24 in empty states. Always label unfamiliar icons; interactive icons need accessible names. Decorative icons use aria-hidden. Transition color/opacity120ms, panel changes180ms; no trailing streaks or looping decorations. Honor prefers-reduced-motion. The product’s speed should be felt through response, not visual noise.

## Implementation / Tailwind v4

Import `@fontsource-variable/manrope` in the app entry. Import Tailwind first, then tokens.css so its @theme inline aliases become utilities (bg-surface, text-text-primary, bg-accent, text-on-accent, border-border-strong, ring-focus-ring, font-sans). Copy assets/fonts/manrope-latin-wght-normal.woff2 to your public font directory for manual self hosting; it is Latin only. Use Fontsource language subset imports for Cyrillic/Greek or additional supported scripts; Manrope does not cover every script. Use data-theme="light" or data-theme="dark" on html; .dark also works; absent explicit selection follows system. For ordinary CSS, use --gs-* variables. `tokens.json` uses W3C DTCG typed values (including colorSpace/components); theme.light/dark are separately named groups. Select one theme before flattening. Each non-color token is typed. No production app or repository was changed.

## Asset index

- assets/logos: horizontal, stacked, mark, wordmark, horizontal-wtf × light/dark/mono SVG
- concepts: three geometric marks and one paragraph each
- assets/icons: six product icons + six status icons
- assets/favicon.svg + favicon16/32/48.png + favicon.ico; apple-touch180.png
- assets/app-icon512/1024.png and corresponding SVG sources (square, OS applies mask)
- assets/social/og1200x630.png/svg; email-header1200x240.png/svg (display at600×120)
- email-magic-link.html: 600px email template with image and live text; replace header URL/link/expiry placeholders
- tokens.json/css, voice-and-microcopy.md, reports/contrast.md/json
- brand-board.html: offline self-contained fonts, inline SVG, theme switch
- brand-board.png + brand-board-dark.png: Playwright full page at1440 CSS pixels, DPR1

## Reproduce

Source ~/.config/devbox/env.sh. This directory is standalone and has no git repository. Build tools are isolated in .tools. `npm ci --prefix .tools` installs the exact locked Node dependencies. Python tooling is pinned in .tools/requirements.txt. Run `.tools/venv/bin/python scripts/build.py`, then `node scripts/render.cjs`. Output writes stay inside this brand directory. No services, production credentials or external writes are required. Fonts/source licensing: https://fontsource.org/fonts/manrope/about ; https://github.com/google/fonts/tree/main/ofl/manrope . Lucide design reference: https://lucide.dev/guide/design .