# Enno logo kit Version 1.0, October 17, 2026. Direction C is the selected composition. This kit includes the subsequent wider, heavier HEY and a same-hue dark lime for reversed use. The prototype now uses these assets and imports the generated brand tokens through its central UI foundation. The live `/styleguide` and repository document `docs/design-system.md` describe the wider UI token system. Unimplemented product flows are not finalized by the identity. Open [preview.html](preview.html) for the visual reference. [Download the full ZIP](../enno-logo-kit.zip) for the assets and this guide. [source.json](source.json) records the exact geometry and font fingerprint; [manifest.json](manifest.json) inventories the kit with SHA-256 checksums. ## The identity The name is **Enno**, the greeting is **Hey Enno**, and the domain is **heyenno.de**. HEY sits inside the upper bar of a custom, heavier E. Its lower edge is lightly cropped, with a narrow opening below it: work being scanned into Enno. A small gap keeps the greeting separate from the slot. The tight all-bold wordmark, shared left alignment, scan crop and small gap are intentional. Do not retype, re-kern or independently reposition HEY. ## Choose an asset | Asset family | Use | Recommended minimum | | --- | --- | --- | | `enno-wordmark-*` | Full HEY/ENNO composition, website or larger identity use | 280 px wide / 40 mm print | | `enno-wordmark-small-*` | Compact headers, narrow layouts | 96 px wide / 18 mm print | | `enno-mark-*` | Standalone E with HEY and scan slot | 72 px wide / 12 mm print | | `enno-mark-small-*` | Standalone E with a solid green bar | 24 px wide | | `enno-mark-micro-*` | Plain one-color E, no small detail | 16 px wide | | `enno-ai-bar-*` | Proposed reusable AI-assistance motif | See the AI bar section | Minimum sizes are optical recommendations for this first kit, not a promise for every device, display or printing process. Proof at actual size. Below 280 px, use the small wordmark instead of trying to read a miniature HEY. Below 24 px, use the plain E. At 136 px, the small wordmark's bar is about 3.5 px high: it replaces HEY, not the thin scan slot. ## Color variants | Suffix | Body | Greeting or small bar | Placement | | --- | --- | --- | --- | | `primary` | Ink `#282b24` | Lime `#a3e635` | Light, quiet backgrounds | | `reversed` | Paper `#f5f4ee` | Lime on light `#598400` | Dark, quiet backgrounds | | `mono-black` | Pure black | Transparent knockout | One-color light-background use | | `mono-white` | Pure white | Transparent knockout | One-color dark-background use | Use the supplied variants rather than applying CSS filters or recoloring the entire SVG. The large color logo has a genuinely transparent scan slot. The slot and monochrome HEY are Boolean openings directly in the E contour, not rasterized SVG masks, painted white details or blur effects. The small color logo has a filled green bar. Monochrome artwork uses actual knockouts for both details; it does not simulate transparency with a painted background. Preserve those distinctions. Paper and Ink are the preferred supporting surfaces. The current UI accent `#d9ed85` is a separate, pale surface color, not the logo's lime. The former olive reversed green is not part of this kit. There is no second green hue: `#598400` is derived from `#a3e635` in OKLCH. The hue angle is held at 128.85 degrees, lightness is reduced, and chroma is reduced only as needed to stay inside sRGB. After 8-bit hex rounding, the actual hue difference is about 0.02 degrees. The dark derivative reaches 4.44:1 contrast on white and 4.03:1 on Paper. The derivation checks contrast after rounding, not just on an ideal unquantized color. The 4.0:1 target is for this logo and non-text motif, not a normal-text accessibility claim. Use Ink or a separately checked text color for ordinary small UI text. Emerald/teal-like alternate greens are not part of the palette. A darker lime will naturally look less luminous than the bright original; do not compensate by rotating its hue toward emerald. All supplied colors and PNGs are RGB/sRGB. For professional print, arrange a proof and color-managed conversion; no CMYK or Pantone match is specified. ## Clear space and sizing Keep at least **one E-stem width** clear on every side. In master coordinates, the stem is 18 units, the wordmark is 270.4 by 70, and the standalone E is 66 by 70. Clear space is outside the SVG's viewBox, not included in it. Container padding must provide it. Square platform icons already have padding. Keep the original aspect ratio. Do not stretch the files, change spacing, rotate the wordmark, add outlines or shadows, or attach extra symbols to the selected logo. Do not put it on detailed photographs without a quiet backing surface. Use the E asset rather than cropping a wordmark by eye. ## Formats and files - `svg/`: vector masters. All letters are paths; no fonts, scripts, external images or external references are required. Optical strokes, scan crops and monochrome knockouts are fully resolved into filled contours. There are no SVG masks, filters, clip paths or live strokes in logo masters. - `png/`: transparent wordmarks at 320, 640, 1280 and 2560 px; detailed E marks at 128, 256, 512 and 1024 px; small E marks at 32, 64, 128, 256 and 512 px; plain E marks at 16, 32 and 64 px. Width is encoded in the filename. - `icons/`: adaptive SVG favicon, multi-resolution ICO, 16/32/48 px PNG icons, 2x/3x density companions, 180 px Apple touch icon, 192/512 px app icons and separate maskable versions. - `tokens.css`: generated color and motif-ratio primitives, imported by the application's `src/styles/tokens.css`. UI semantics, radii and spacing belong to that separate foundation. - `NOTICE.txt`: font attribution and the recorded source permission. The ICO uses a plain E at 16 px and the green-bar E at 32/48 px. The SVG favicon adapts its backing tile, E and bar colors to the browser's color scheme. Raster platform icons use the primary light tile. In browser previews, use the provided `srcset` density companions rather than stretching a 1x PNG across a Retina display. A 16 px icon is not intended to be enlarged as an illustration; use the vector mark for large previews. Apple/app PNGs are opaque; maskable files use a full-bleed backing surface with the E inside the central circular 80% safe zone. `icons/manifest.example.json` is an icon inventory for a future app manifest, not an installed PWA configuration. Do not replace an application's full manifest with this example. The prototype's metadata now references the adaptive favicon, ICO and Apple icon from this kit. No PWA, deployment or backend configuration is introduced. ## The AI bar: identity beyond the logo The user intends the green bar to recur in valuable UI interactions, probably where AI assists. This is a confirmed visual direction, not yet a complete mapping of every AI event or a requirement to mark every screen. The UI prototype now displays the cue on its explicitly labeled capture and draft concepts. There is still no AI processing. The motif comes from the **solid small-logo bar**, not from the thin scan opening. Preserve its 36:7 aspect ratio and restrained corners. The small bar ends earlier on the right than the large scan slot, while keeping the same left anchor. For example, 24 by 4.7 px is a sensible first UI study. Use the supplied lime on an Ink backing, or dark lime on a Paper backing. Bright lime is not intended as small text on white. Suggested applications to evaluate: - A labeled entry point to AI-assisted text or photo capture. - An AI-prepared draft awaiting a person's review. - A clearly labeled suggestion or extracted field with its source available. - A brief scanning treatment while a user-requested extraction runs. The bar must not mean "verified", "paid", "issued", "saved" or "correct". It is not a success indicator, not an authorization boundary, and not a replacement for deterministic invoice status. Always pair the cue with clear text or an accessible name; color alone must not carry the meaning. For motion, respect reduced-motion preferences and distinguish pending, completed and failed work with explicit UI. Do not use a looping animation to conceal missing progress or a failed request. Use the cue selectively. Do not scatter it as generic decoration or turn every ordinary control green. The exact states, placement, accessibility, animation and reuse API remain future UI design/implementation decisions. ## Web usage Prefer an image with an explicit accessible name and dimensions: ```html Hey Enno ``` At compact sizes, select `enno-wordmark-small-primary.svg`. If the linked image is the only content of a home link, name it "Enno home". If adjacent text already supplies the same name, use an empty image alt to avoid repeats. Do not announce a decorative AI bar separately from its associated label. ## Source, provenance and regeneration Klaxon Smooth by Edward Batkins supplies the HEY and NNO letterforms. The E is custom. HEY is 8% wider with an optical 0.5-unit stroke; NNO retains the approved 4-unit optical expansion. This is not a native font Bold weight. DM Sans remains the planned interface typeface; logo assets do not depend on it. See `NOTICE.txt`; font binaries are not included in this kit. The repository's reproducible source lives in: ```text scripts/brand/generate_logo_svg.py scripts/brand/color_scale.py scripts/brand/export-logo-kit.mjs scripts/brand/test_logo.py scripts/brand/verify-logo-kit.mjs scripts/brand/package-logo-kit.py ``` From the repository root: ```sh python3 -m venv scripts/brand/.venv scripts/brand/.venv/bin/python -m pip install -r scripts/brand/requirements.txt scripts/brand/.venv/bin/python scripts/brand/generate_logo_svg.py node scripts/brand/export-logo-kit.mjs scripts/brand/.venv/bin/python -m unittest discover -s scripts/brand -p 'test_*.py' node scripts/brand/verify-logo-kit.mjs python3 scripts/brand/package-logo-kit.py ``` SVG generation needs Python 3.9+, fontTools and skia-pathops, pinned in `scripts/brand/requirements.txt`. The isolated build environment is ignored by Git. Optical strokes are expanded before cropping and Boolean subtraction. Raster exports use Sharp supplied by the existing locked Next.js dependency tree (created with 0.35.5). No new application dependency is required. Do not edit generated paths or PNGs by hand; update the source and regenerate. Regenerate the manifest after changes to guide, preview, tokens or assets. The kit records a visual selection, not trademark clearance or legal exclusivity. Review those separately before a public launch.