8px
Kleine Elemente
Labels, kompakte Tags und kleine Flächen.
brand-radius-small03 / Visuelle Identität
Charakter zeigen. Klarheit behalten.
Dunkles Petrolgrün gibt dem Auftritt Ruhe und Tiefe. Helle Flächen, mintfarbene Auswahlzustände und klare Rundungen machen Velcure zugänglich. Archivo und Geist tragen Überschriften und Lesetext; Nah prägt die Wortmarke.
03.0
Die Wortmarke
Nah ist die Velcure-Wortmarke. Sie basiert auf Hanken Grotesk mit einem angepassten V. Die Fokus-Bildmarke ergänzt die offenen Buchstaben zu einer gemeinsamen Identität.
Klare Haltung. Weiche Formen.
Farbe & FormPetrolgrün / #032f2e
Unsere ruhige
Grundfläche.
Das dunkle Grün gibt Navigation und Markenflächen Tiefe. Helle Schrift schafft Kontrast; Mint kennzeichnet die aktive Auswahl.
Rundungen gehören zu Velcure.
Das Fokus-Zeichen und die Nah-Wortmarke verbinden klare Konturen mit runden Übergängen. Diese Formensprache setzt sich in den Oberflächen fort.
Radien folgen der Größe und Funktion einer Fläche. Kleine Elemente bleiben präzise; große Flächen erhalten mehr Rundung. Kreise bleiben Punkten und runden Symbolen vorbehalten.
12px
Interaktive Elemente
Navigation, Buttons und Eingabefelder.
brand-radius-control20px
Panels
Karten, Logo-Tafeln und zusammengehörige Inhalte.
brand-radius-panel28px
Große Flächen
Sidebar, Markenbühnen und große Bildflächen.
brand-radius-frameVerschachtelte Flächen verwenden innen einen kleineren Radius als außen. Die Logo-Geometrie bleibt unverändert; Oberflächenradien verändern das Zeichen nicht.
03.1
Die Palette
Tinte
#0e1a24Wortmarke, Headlines, dunkle Flächen
Velcure-Grün
#1c7a4bMarkenakzent und primäre Aktion
Canvas
#f3f5f7Ruhige Grundfläche
Papier, sekundär
#f8f9fbSekundäre Flächen
Erledigt
#1c7a4bBestätigt und abgeschlossen
Prüfen
#7c5200Aufmerksamkeit erforderlich
Information
#1d5aa6Hinweise und Tastaturfokus
Fehler
#c0262dFehler und überfällige Aufgaben
Die ersten vier Farben entsprechen der Website. Grün ist Markenfarbe und zugleich Farbe für abgeschlossene Zustände. Gelb, Blau und Rot bleiben fachliche Statusfarben. Die UI-Farben sind keine normgerechten Sicherheitszeichen. Jede Statusanzeige braucht zusätzlich Symbol und Text.
03.2
Typografie
Archivo / Display / 600
Verantwortung
braucht Überblick.
Aa Bb Cc Dd Ee Ff Gg Hh Ii Jj Kk Ll Mm Nn
0123456789 · ÄÖÜäöüß
Geist / Lesetext & Navigation / 400 + 500 + 600
Arbeitsschutz lebt von Menschen, die Verantwortung übernehmen. Velcure bringt ihre Aufgaben in einen Zusammenhang.
Die Navigation verwendet Geist Medium in 14 px mit 1,45-fachem Zeilenabstand. Aktive Einträge stehen in 600; Gruppenüberschriften in 12 px und 500. Beide Schriften werden lokal ausgeliefert. Keine externen Font-Anfragen. Für Marketingüberschriften eine fließende Skala. Die Core-App verwendet Inter und eigene feste Schriftrollen; Details unter „App & Marke“.
03.3
Maß und Rhythmus
xs0.25remsm0.5remmd0.75rembase1remlg1.5remxl2rem2xl3rem3xl4rem4xl6rem4-px-Grundraster. Kleine Abstände verbinden, große Abstände trennen. Inhalt maximal 1280 px breit; Fließtext maximal 65 Zeichen pro Zeile. Brand-Radien: 8 px für kleine Elemente, 12 px für Controls, 20 px für Panels und 28 px für große Flächen.
03.4
Bildsprache & Bewegung
Echte Arbeit. Echte Situationen.
Betriebe, Arbeitsplätze, Material und Menschen bei konkreten Aufgaben. Natürliches Licht, klare Ausschnitte, respektvolle Perspektive. Bildrechte und Einwilligungen prüfen.
Zeigen, was zusammengehört.
Produktbilder erklären einen Arbeitsablauf. Keine erfundenen Kennzahlen, Kundensiegel oder Zertifikate. Bewegung verdeutlicht Zustände: 120–200 ms, keine Dauereffekte, reduzierte Bewegung respektieren.
03.5
Barrierefreiheit
Kontrastziel mindestens 4,5:1 für normalen Text. Sichtbarer Tastaturfokus, benannte Controls und bedienbare Formulare. Status nie nur über Farbe. Prüfen bei 390, 768 und 1440 px sowie mit Tastatur und reduzierter Bewegung.