The OLED Design Principle

Ein visueller Guide für minimalistische, hochkontrastreiche User Interfaces.

Das Kernprinzip

100%

Fokus auf puren Kontrast. Der Hintergrund ist immer pures Schwarz (`#000000`), um den "Pixel-Aus"-Effekt eines echten OLED-Displays zu simulieren und maximale Klarheit zu schaffen.

1. Die Farbpalette: Absoluter Kontrast

Die Farbgebung ist streng und funktional. Sie basiert auf einem schwarzen Hintergrund, einer einzigen leuchtenden Akzentfarbe und neutralen Grautönen für Text und Ränder.

Hintergrund

Immer `#000000`. Keine Kompromisse.

Akzentfarbe

Eine kräftige Farbe für interaktive Elemente.

Text & Ränder

Neutrale Töne für optimale Lesbarkeit.

2. Die Typografie: Klar & Technisch

Monospace-Schriftarten sind die erste Wahl. Ihre feste Zeichenbreite sorgt für eine aufgeräumte, technische Ästhetik und exzellente Lesbarkeit.

  • Roboto Mono

    Modern, klar und neutral. Ein hervorragender Allrounder.

  • Fira Code

    Beliebt bei Entwicklern, unterstützt Code-Ligaturen.

  • Source Code Pro

    Elegant und sehr gut lesbar, entworfen von Adobe.

  • IBM Plex Mono

    Ein Hauch von Retro mit modernem Charme.

3. UI & Layout: Scharf & Funktional

Die Gestaltung von UI-Elementen folgt einem einfachen Regelwerk, das auf Funktionalität und eine klare visuelle Sprache abzielt.

Element-Design

Rundungen?

NEIN

(`border-radius: 0`)

Schatten/Verläufe?

NEIN

(Minimalismus)

Ränder?

JA

(Dünn, `1px`)