Spacing Scale Generator

Eine Abstands-Skala ist das Fundament eines kohärenten Design-Systems. Statt willkürliche Pixelwerte über die gesamte Oberfläche zu verteilen, sorgt eine konsistente Skala für visuelle Harmonie und macht Layouts für Designer und Entwickler vorhersehbar. Dieses Werkzeug erzeugt eine sorgfältig berechnete Abstands-Skala auf Grundlage eines mathematischen Verhältnisses, sodass jeder Schritt proportional und absichtsvoll wirkt.

Um das Werkzeug zu nutzen, wählen Sie Ihre Basis-Abstandseinheit (normalerweise 4px oder 8px), wählen Sie ein Skalen-Verhältnis (wie Goldener Schnitt, Große Terz oder Reine Quarte) und generieren Sie Ihre komplette Skala. Die Ausgabe enthält alle Abstandswerte, die Sie für Innenabstände, Außenabstände, Lücken und andere Layout-Messungen benötigen. Sie können einzelne Werte kopieren oder die gesamte Skala in Formaten wie CSS-Variablen, Tailwind-Konfiguration oder JSON exportieren, um sie nahtlos in Ihr Design-System zu integrieren.