ETA Intel brand authority.

Horizontal, black

logo_black

SVG2.3 KBPNG2.6 KBWEBP17.1 KBJPG77.3 KB

Horizontal, white (inverse)

logo_white

SVG2.2 KBPNG2.5 KBWEBP17.1 KBJPG26.2 KB

Icon mark, black

icon_black

SVG656 BPNG964 BWEBP15.9 KBJPG48.4 KB

Icon mark, white (inverse)

icon_white

SVG656 BPNG979 BWEBP15.9 KBJPG5.1 KB

SVG is het bronbestand, zonder kwaliteitsverlies op elke schaal, en gebruikt voor de voorbeelden hierboven. Elk ander formaat op deze pagina is daaruit gegenereerd. PNG bevat transparantie voor algemeen gebruik. WEBP is een web-geoptimaliseerd raster op 1,5x. JPG is platgeslagen op een ondoorzichtige achtergrond op 4x, het grootste bestand, zonder transparantie. Twee print-ready exports staan nog open, EPS en PDF; geen van beide was beschikbaar op het moment van schrijven.

r 8

Icon viewBox

0 0 104.93 104.93

Horizontale lockup viewBox

0 0 450.95 104.93

Icoonradius, los object

8px (7.6% van de zijde)

Interfaceradius, in-page elementen

4px

Horizontale lockup-verhouding

4.30 : 1

Badge aspect

1 : 1

Layout grid

8pt soft grid, 12 kolommen

Twee radiussen, twee verschillende dingen. 8px is de constructie van het icoon zelf, gebruikt wanneer de badge op zichzelf staat als object (het beeldmerk zelf, een avatar, een favicon). 4px is de radius voor kleine interface-elementen binnen een pagina, knoppen en chips zoals de downloadlinks op deze pagina, passend bij de bestaande 4/8/12px radiusschaal van de site in plaats van de radius van het icoon te lenen.

Het merk draagt een echt neutraal drukinkt-zwart, Ink op #0F0F0F, zodat het persingsafhankelijk blijft. Schermtekst draait op slate-900 op #0F172A voor zachtere leesbaarheid. Ze zijn bewust verschillend, en alleen het beeldmerk heet Ink.

CMYK is berekend vanuit sRGB, niet kleurgemanaged of drukproef-gecheckt.

*Pantone is de dichtstbijzijnde Pantone Coated-match op RGB-afstand, kruislings gecontroleerd via twee onafhankelijke converters en getoond met hun matchpercentage. Het is een startpunt voor proefdrukken, geen gecertificeerde match. Controleer tegen een fysiek Pantone-boek vóór drukproductie. De bijna-witte entries hebben geen spot-match: Pantone’s coated-bibliotheek heeft geen echt papierwit, specificeer die als onbedrukt substraat.

Drie verschillende afnemers, drie verschillende regels. De browsertab toont wat je aanlevert, ongewijzigd, daarom staat het beeldmerk er op zichzelf, zonder badge: op 16px leest een volledige badge als een donkere vlek, de kale glyph op volledige hoogte blijft leesbaar. iOS en Android tonen het niet ongewijzigd: beide passen hun eigen masker toe, dus een badge met eigen afgeronde hoeken wordt dubbel afgerond, of toont een achtergrondkleur in de ruimte ertussen. De constructie van de badge (8px radius, zie Constructie) is correct zoals gedocumenteerd en ongewijzigd voor het logo zelf. De Apple- en Android-bestanden hieronder zijn aparte, full-bleed builds zonder eigen hoekradius, specifiek gebouwd zodat het masker van elk platform niets verkeerd bijsnijdt.

Browsertab

ICO, multi-size

16, 32 en 48px gebundeld in één bestand, de universele fallback.

16×16

32×32

48×48

favicon.ico1.1 KB

SVG, schaalbaar, thema-bewust

Alleen het beeldmerk, geen badge, geschaald naar volledige hoogte. Twee bestanden; de browser schakelt er zelf tussen op basis van het systeemkleurschema. Geen van beide draagt een achtergrond, dus elk leest alleen correct tegen het eigen thema.

Light

Dark

icon.svg570 Bicon-dark.svg567 B

Apple touch icon

180 × 180, full bleed, zonder eigen hoekradius. iOS past er zijn eigen masker overheen.

apple-touch-icon.png1.3 KB

PWA web manifest

Any

Getoond zoals het is, de eigen afgeronde hoeken van de badge intact.

192×1922.4 KB512×51210.2 KB

Maskable

Full-bleed vierkant, dezelfde vorm als "Any". Een OS-launcher kan het runtime bijsnijden tot een cirkel of squircle; de glyph blijft buiten dat bijsnijgebied (zie de toelichting hieronder).

192×1921.4 KB512×5124.6 KB

De glyph zit ruim binnen de veilige zone die Android vereist (een gecentreerde cirkel van 80% van de icoongrootte): gemeten van hoek tot hoek reikt de glyph tot ongeveer 72% van die grens, dus de maskable build had een full-bleed achtergrond nodig maar geen herpositionering van het beeldmerk zelf.

• Minimumhoogte, woordmerk: 24px digitaal. Dat is de kleinste toepassing in productie op dit moment, in de sitefooter.
• Minimumformaat, icoonmerk alleen: 16px, de faviconondergrens.
• Vrije ruimte: houd minstens 8px lege marge (één hoekradius-eenheid) aan elke zijde, meer waar de layout het toelaat.
• Gebruik de zwarte variant op lichte oppervlakken, de witte op donkere. Plaats geen van beide op een middentint-achtergrond waar het contrast wegvalt.
• Kleur het beeldmerk niet om. Inkt en oppervlak zijn de enige twee kleuren die het draagt.
• Roteer, vervorm of rek het niet. De badge is altijd een 1:1 vierkant met een 8px hoekradius.
• Voeg geen slagschaduw, contour of effect toe dat niet op deze pagina staat.
• Scheid het woordmerk niet van de badge binnen een lockup. Het icoonmerk op zichzelf is het enige goedgekeurde zelfstandige gebruik van de badge.

Elk bestand op deze pagina in één archief: vier logovarianten in SVG, PNG, WEBP en JPG, de volledige favicon- en app-icoonset, en de kleurwaarden als JSON.

106.4 KB · 28 bestanden

Kolommen klappen in naar volledige breedte onder het eigen breakpoint van de layout, overeenkomend met hoe elk raster op de site zich al gedraagt.

• Beeldverhouding: 3:2, bijgesneden met object-cover. Dezelfde verhouding als elke titelkaart in het netwerk.
• Onderwerp: echte faciliteiten en hardware, documentaire stijl. Geen geënsceneerde lifestylefotografie, geen mensen als onderwerp.
• Licht: golden hour of blue hour, natuurlijk en gericht, nooit vlakke studiobelichting.
• Geen beeld beschikbaar: valt terug op een neutraal slatevlak, nooit een placeholder-afbeelding of stocksilhouet.
• Houd de horizon en het hoofdonderwerp binnen het kader op elke bijsnijdbreedte, zoom niet voorbij wat de compositie kan verliezen.
• Eén foto, één onderwerp. Combineer of collage geen meerdere scènes in één kaartafbeelding.

Correct. Volledige compositie, horizon en onderwerp intact.

Incorrect. Ingezoomd en decentraal, het onderwerp en de horizon zijn verloren.

Dezelfde bronfoto, /titles/floatingwindindex.webp, op twee manieren bijgesneden ter vergelijking.

{
  "system": "ETA Intel identity system",
  "updated": "2026-08-07",
  "note": "Generated from the same values documented on /brand. Font sizes are given in rem assuming a 16px root, matching the site's own Tailwind setup.",
  "color": {
    "ink-logo": {
      "value": "#0F0F0F",
      "usage": "Badge fill, both logo variants"
    },
    "surface-logo-mark": {
      "value": "#FFFFFF",
      "usage": "Icon glyph inside the badge, and the badge fill on the white/inverse variant"
    },
    "ink-text": {
      "value": "#0F172A",
      "usage": "Headings and primary text (slate-900)"
    },
    "charcoal-body": {
      "value": "#475569",
      "usage": "Body copy (slate-600)"
    },
    "steel-muted": {
      "value": "#94A3B8",
      "usage": "Eyebrows, labels, secondary text (slate-400)"
    },
    "silver-hairline": {
      "value": "#E2E8F0",
      "usage": "Borders, dividers (slate-200)"
    },
    "surface": {
      "value": "#F8FAFC",
      "usage": "Page and card surface (slate-50)"
    },
    "white": {
      "value": "#FFFFFF",
      "usage": "Base surface"
    },
    "verified-green": {
      "value": "#047857",
      "usage": "Confirmation, verification, success state (emerald-700). The only functional color in the system"
    }
  },
  "typography": {
    "fontFamily": {
      "sans": [
        "Inter",
        "system-ui",
        "sans-serif"
      ],
      "mono": [
        "ui-monospace",
        "SFMono-Regular",
        "monospace"
      ]
    },
    "heading1": {
      "fontSize": {
        "base": "2rem",
        "sm": "2.25rem",
        "lg": "3rem"
      },
      "fontWeight": 700,
      "lineHeight": 1.1,
      "letterSpacing": "tight",
      "fontFamily": "sans"
    },
    "heading2": {
      "fontSize": {
        "base": "1.5rem",
        "lg": "1.875rem"
      },
      "fontWeight": 700,
      "letterSpacing": "tight",
      "fontFamily": "sans"
    },
    "body": {
      "fontSize": {
        "base": "1rem",
        "lg": "1.125rem"
      },
      "fontWeight": 400,
      "lineHeight": "relaxed",
      "fontFamily": "sans"
    },
    "label": {
      "fontSize": "0.625rem",
      "fontWeight": 400,
      "textTransform": "uppercase",
      "letterSpacing": "0.12em",
      "fontFamily": "sans"
    },
    "caption": {
      "fontSize": "0.6875rem",
      "fontWeight": 400,
      "lineHeight": "relaxed",
      "fontFamily": "sans"
    },
    "data": {
      "fontSize": "0.75rem",
      "fontWeight": 400,
      "fontFamily": "mono"
    },
    "button": {
      "fontSize": "0.875rem",
      "fontWeight": 500,
      "fontFamily": "sans"
    }
  },
  "spacing": {
    "unit": "8px",
    "scale": {
      "1": "8px",
      "2": "16px",
      "3": "24px",
      "4": "32px",
      "5": "40px",
      "6": "48px",
      "8": "64px",
      "10": "80px",
      "12": "96px",
      "16": "128px"
    }
  },
  "grid": {
    "columns": 12,
    "gap": "24px",
    "maxWidth": "1200px",
    "breakpoints": {
      "sm": "640px",
      "md": "768px",
      "lg": "1024px",
      "xl": "1280px"
    }
  },
  "radius": {
    "interface": "4px",
    "iconStandalone": "8px",
    "large": "12px"
  }
}

Vandaag draait de live site als een enkele Next.js 14-applicatie op de App Router met React 18 en Tailwind, gedeployed als één Vercel-project. Dat is de stand die deze sectie vastlegt, en die is gedateerd: een monorepo-migratie is nu onderweg die deze feiten verandert. Geverifieerd 8 augustus 2026. Direct geteld vanuit de hub-codebase op die dag bevat het 47 paginabestanden en 5 route handlers. Van de 15 titels in de datalaag is tandempanels de enige die als live is gemarkeerd; de rest deelt deze ene hub totdat er een eigen titelsite voor is gebouwd.

Oudere planningsdocumenten beschrijven een andere architectuur: een Astro-monorepo met één Vercel-project per titel. Dit is niet die codebase, en de eigen statusnotities van het project markeren de afwijking al direct in plaats van het te laten staan. Deze pagina beschrijft het systeem zoals het draait, niet zoals die documenten aannamen dat het zou zijn.

• /titles/[slug]: dynamische route met generateStaticParams. 15 statische pagina's, één per titel. Elke titelpagina deelt dezelfde layout, hero en contentblokken.
• Inhoudspagina’s: about, advertise, magazine, directory, research en de merkdocumentatie die je nu leest. Met de hand gebouwd op dezelfde componenten: PageHero, ContentSection, hetzelfde typografieritme.
• Hubpagina’s: de navigatiepagina’s die de structuur bij elkaar houden. Overzichten, categorie-indexen en landingspagina’s.
• Route handlers: 5 in totaal. Authenticatie, versie-endpoint en zoekindex. Serveren data, geen markup.

Een titel krijgt geen eigen stem door nieuwe copypatronen te schrijven. Het krijgt er een door dezelfde componenten over te nemen waarop deze pagina is gebouwd: PageHero voor de openingsclaim, ContentSection voor alles wat volgt, en de typografierollen hierboven gedocumenteerd voor wat telt als heading, label of data. Consistentie komt uit hergebruik, niet uit een stijlgids die opnieuw gelezen moet worden voor elke nieuwe pagina.

Dit is een principe, geen copy-inventaris. Er bestaat nog geen per-titel berichtenaudit. Naarmate titels van stub naar live gaan, moet hun copy getoetst worden aan dit principe in plaats van aan een apart berichtendocument dat niet is geschreven.

15 workflowbestanden in n8n-workflows/, elk gekoppeld aan een webhook-pad met een gedeelde honeypot, timingcheck en een op headers gebaseerd gedeeld geheim. Alle workflows zijn actief en verbonden aan de live n8n Cloud-instantie.

Tegen de standaard Brand Authority-eis: een bevestiging binnen 60 seconden en een melding aan het salesteam met context. Beide zijn ontworpen in de workflows, in tekst en in de velden die elke interne melding meestuurt, en beide zijn operationeel.

Stack

Next.js 14, App Router, React 18, Tailwind. Geen CMS.

Deployment

Eén codebase, één Vercel-project.

Datalaag

Supabase, gemigreerd voor directory-publiek en verificatiedata.

Automatisering

n8n Cloud, 15 workflowbestanden, geïmporteerd als inactief.

Deze samenvatting komt uit docs/PAGINA-KAART.md en docs/PROJECTSTATUS-2026-07-31.md, de eigen interne auditdocumenten van het project. Beide staan in de repository in plaats van achter een publieke link; een downloadbaar architectuurdocument dat geen repository-toegang vereist is nog niet gebouwd, en is een open punt in plaats van iets dat hier als afgerond wordt gepresenteerd.