Zum Inhalt springen
ZVVAtlas · Showcase

Command Palette

Schnell durch Atlas navigieren

Typographie

ZVV Brown Narrow ist die Corporate-Schrift (Lineto-lizenziert) für alle UI-Texte. Geist Mono für Code, Logs, IDs.

ZVV Brown Narrow · Body-Font

text-4xl · font-bold (700)

Der Zürcher Verkehrsverbund.

text-2xl · font-bold (700)

Mehrmandantenfähige Plattform

text-base · normal (400)

Atlas trägt das Fundament aller digitalen Anwendungen des Zürcher Verkehrsverbunds. Wenn ein Team eine neue ZVV-App baut, fängt sie hier an.

text-sm · normal (400)

Mit jeder neuen ZVV-App wächst die Gefahr, dass jede ihr eigenes Login, ihre eigene Topbar, ihre eigenen Farb-Tokens erfindet.

text-xs · normal (400)

Stand v0.1.0 · 2026-05-28 · Internes Tool für ZVV-Mitarbeitende

Geist Mono · Code & Mono

const APP_VERSION = '0.64.6'
const COMMIT = 'a4bf5db'
const PROD_URL = 'https://fzdb.zvv.ch'
// Build-Info im Footer

Setup in Next.js

Schriften lokal hosten (kein FOUT, kein externer Request), vianext/font/localbinden.

app/layout.tsxtsx
// app/layout.tsx
import localFont from 'next/font/local'
import { GeistMono } from 'geist/font/mono'

const zvvBrown = localFont({
  src: [
    { path: '../public/fonts/ZVVBrownNarrowWeb-Regular.woff2', weight: '400' },
    { path: '../public/fonts/ZVVBrownNarrowWeb-Bold.woff2',    weight: '700' },
  ],
  variable: '--font-zvv',
  display: 'swap',
  preload: true,
})

<html className={`${zvvBrown.variable} ${GeistMono.variable}`}>