Design-System · live

Markenleitfaden

Alles hier wird aus denselben Tokens wie die Website und denselben Dateien gerendert, die Sie herunterladen. Ändern Sie einen Wert an der Quelle und diese Seite ändert sich mit — eine veraltete Fassung gibt es nicht. Klicken Sie auf einen Wert, um ihn zu kopieren.

Das Zeichen

Datei zum Download

PadsAmbiente

Von der Website gerendert

Das Raster ist das Zeichen. Es ist kein Ornament: Das sind Pads, die ein Kreuz bilden, und es ist dasselbe Raster aus 24 Tonarten, das das Produkt und das Layout dieser Website strukturiert.

So jaDas Symbol allein verwenden, wenn der Kontext den Namen bereits nennt.
So jaEs blau oder weiß auf dunklem Grund einfärben.
So jaDie Version für hellen Grund verwenden, wenn der Grund hell ist — dafür ist sie da.
NiemalsDen Eckenradius der Felder ändern — sie sind fast quadratisch.
NiemalsDie beiden Wörter der Wortmarke auf eine Zeile setzen.
NiemalsDie konturierten Felder verdicken, damit sie in kleiner Größe auffallen — nehmen Sie die kleine Datei, die bereits nur das Kreuz trägt.
NiemalsAußerhalb der Palette dieser Seite umfärben.

Download

Per Skript aus der Vektordatei und den Tokens erzeugt. Die App hat keine Vektorfassung des Zeichens — diese hier ist die einzige, deshalb kommt alles von hier.

Komplettes KitAlle Dateien unten, dazu die Nutzungsregeln als Klartext.832 KB

Store-Icons

ios 102420 KB PNG
maskable 1922 KB PNG
maskable 5128 KB PNG
play 51213 KB PNG

Nutzung

SchutzraumEin Rasterschritt auf jeder Seite. Das Zeichen atmet in seinem eigenen Maß, nicht in einer willkürlichen Zahl.25.4%

100px +< 100px

MindestgrößeUnter 100 px fällt die Linie der konturierten Felder unter ein Pixel und wird zu grauem Brei. In diesen Größen trägt die Datei bereits nur das Kreuz — verdicken Sie die Linie nicht als Ausgleich.

Was Sie nicht tun sollten

NiemalsStrecken oder stauchen
NiemalsDrehen
NiemalsAußerhalb der Palette umfärben
NiemalsAuf einem Grund ohne Kontrast

Farben

Beim Build direkt aus der Quelle des Design-Systems gelesen — diese Liste kann nicht von der Website abweichen.

Hintergrund

Text

Blau — die Markenfarbe

Tonart — aus der App übernommen

Zustand

Typografie

Fraunces

Display. Hero, Überschriften und Zitate — die menschlichen Momente.

Archivo

Text und Oberfläche. Fließtext, Navigation, Buttons.

IBM Plex Mono

Technisch. Labels, Daten, Tonarttabellen.

Poppins

Wortmarke. Nur für die Marke — es ist die Schrift der App.

Skala

Fließend mit clamp() — es gibt keinen Breakpoint für die Schriftgröße.

Aa--step-6Hero der Startseite
Aa--step-5Seitentitel
Aa--step-4Abschnittstitel
Aa--step-3Zwischenüberschrift
Aa--step-2Kartenname
Aa--step-1Vorspann
Aa--step-0Fließtext
Aa--step--1Nebentext

Radius, Elevation und Bewegung

Der Rest des Design-Systems, aus derselben Quelle.

Radius

Elevation

Bewegung

--dur-fast
--dur-base
--dur-slow
--ease-out

E-Mail-Signatur

Auf „Signatur kopieren“ klicken und direkt in das Signaturfeld von Gmail, Outlook oder Proton einfügen — sie wird formatiert eingefügt, nicht als Code.

		Ihr Name Funktion · Pads Ambiente contato@padsambiente.com.br padsambiente.com
Crescimento do Reino Software e Tecnologia LTDA · CNPJ 65.301.296/0001-26

Markenrecht

„Pads Ambiente“ und das Rasterzeichen sind Marken von Crescimento do Reino Software e Tecnologia LTDA. Die Dateien auf dieser Seite werden bereitgestellt, um die korrekte Nutzung der Marke zu erleichtern — sie übertragen kein Eigentum daran.

So jaDie Marke verwenden, um auf das Produkt zu verweisen — in einem Artikel, Tutorial, Test, Kurs oder einer Integration.
So jaDie Dateien dieser Seite unverändert verwenden.
NiemalsEine Partnerschaft, Förderung oder Empfehlung suggerieren, die nicht besteht.
NiemalsDie Marke in Logo, Namen oder Identität eines anderen Produkts einbauen.
NiemalsDie Marke in einer Domain, App oder Firmierung verwenden.
NiemalsGrafik, Proportionen oder Farben der Dateien verändern.

Für jede darüber hinausgehende Nutzung oder im Zweifel schreiben Sie an contato@padsambiente.com.br