# Figma iOS Android pt dp sp Responsive-Spezifikationskarte Rechnet Figma-px-Werte in die korrekten Plattform-Einheiten um und erzeugt eine Entwickler-Spec-Card: iOS-pt (@1x/@2x/@3x mit gerenderten px je Skalierung), Android-dp/sp (Render-Tabelle mdpi…xxxhdpi und Schriftskalierung), Web-rem/vw mit clamp()-Snippet; Prüfung der minimalen Touch-Ziele (44pt iOS / 48dp Android / 44px und 24px WCAG) samt Material-Fensterklassen und Tailwind-Breakpoints. > Kanonische Seite: https://elysiatools.com/de/tools/figma-ios-android-pt-dp-sp-responsive-design-spec-card - **Kategorie:** Design - **Schlagwörter:** figma zu code, pt, dp, rem, touch-ziel, dichte-buckets ## Überblick Verifizierte Konstanten: iOS-pt = px ÷ Skalierung (@1x=1/@2x=2/@3x=3, historische Basis 163 ppi); Android-dp = px ÷ Dichte (mdpi 160=1x, hdpi 240=1.5x, xhdpi 320=2x, xxhdpi 480=3x, xxxhdpi 640=4x), sp addiert die Nutzer-Schriftskalierung (Stufen 0.85/1.0/1.15/1.3, Android 14+ nichtlinear bis 200 %); Web-rem = px ÷ Root (Standard 16px), vw = px ÷ Viewport × 100, clamp(MIN, VAL, MAX) = max(MIN, min(VAL, MAX)). Touch-Ziele: Apple HIG 44×44pt, Material 48×48dp, WCAG 2.5.5 (AAA) 44×44 CSS-px, WCAG 2.5.8 (AA) 24×24 CSS-px. Responsive: Material-Fensterklassen compact <600dp / medium 600–839dp / expanded ≥840dp; Tailwind-Breakpoints 640/768/1024/1280/1536px. ## Eingaben - **Figma-px-Wert** (number): e.g. 48 - **Design-Skalierungsfaktor** (select) - **Rolle des Elements** (select) - **Root-Schriftgröße (px)** (number) - **Viewport-Breite (px)** (number) ## Wann verwenden - Wenn ein Figma-Maß in iOS-pt, Android-dp oder Web-rem umgerechnet werden soll. - Wenn Touch-Ziele für iOS, Android und WCAG auf Mindestgrößen geprüft werden sollen. - Wenn Entwickler responsive Werte, Dichte-Renderings und Breakpoint-Referenzen benötigen. ## Funktionsweise - Gib den Figma-px-Wert ein und wähle den Design-Skalierungsfaktor 1x, 2x oder 3x. - Wähle die Rolle des Elements: allgemeine Größe, Touch-Ziel oder Textgröße. - Optional lassen sich Root-Schriftgröße und Viewport-Breite für rem- und vw-Werte anpassen. - Die HTML-Spec-Card zeigt die Umrechnungen, Dichte-Tabellen, responsive Hinweise und die Touch-Ziel-Prüfung. ## Anwendungsfälle - Designer übersetzen Figma-Maße in klare iOS-, Android- und Web-Spezifikationen für die Entwicklung. - Produktteams prüfen Button- und Interaktionsgrößen gegen iOS-, Material- und WCAG-Mindestwerte. - Frontend-Teams erstellen aus festen px-Werten responsive rem-, vw- und clamp()-Vorgaben. ## Häufig gestellte Fragen ### Wie wird ein Figma-px-Wert in iOS-pt umgerechnet? Der px-Wert wird durch den gewählten Skalierungsfaktor geteilt: @1x, @2x oder @3x. ### Wie wird Android-dp berechnet? Der Wert wird anhand der Android-Dichte umgerechnet und für mdpi bis xxxhdpi als Render-Tabelle dargestellt. ### Welche Root-Schriftgröße verwendet die Web-Umrechnung? Standardmäßig werden 16 px verwendet. Die Root-Schriftgröße kann zwischen 8 und 32 px angepasst werden. ### Welche Touch-Ziele werden geprüft? Geprüft werden 44pt für iOS, 48dp für Material sowie 44px und 24px nach WCAG. ### Welche responsive Referenzen enthält die Ausgabe? Die Karte nennt Material-Fensterklassen und Tailwind-Breakpoints. ## Ähnliche Tools - [Hash-Algorithmus-Vergleich](https://elysiatools.com/de/tools/hash-algorithm-comparator): Hasht dieselbe Eingabe mit MD5, SHA-1, SHA-256, SHA-512, BLAKE2b und BLAKE3 und vergleicht sie: Ausgabelänge, Hex/Base64-Digest, Sicherheitsstatus (gebrochen/modern) und relatives Geschwindigkeits-Benchmark. Gut für Lehre, Algorithmuswahl und Prüfsummenkontrolle. - [OKR- & KPI-Baum-Zerleger](https://elysiatools.com/de/tools/okr-tree-decomposer): Zerlegt ein Unternehmens-Objective in Abteilung → Team → Personal, mit Gewicht/Ziel/Ist pro Knoten; der gewichtete Fortschritt rollt nach oben. Visueller Baum + Markdown. - [Serum-Anionenlücken-Rechner (AG)](https://elysiatools.com/de/tools/anion-gap-calculator): Berechnet die Serum-Anionenlücke AG = Na⁺ − Cl⁻ − HCO₃⁻ (mmol/L), optional mit K⁺-Formel und Albumin-Korrektur. Ein erhöhter AG (≈ >12) spricht für eine Akkumulation nicht gemessener Anionen (Laktat, Ketonkörper, Methanol/ethylenglykol, Salicylate, Niereninsuffizienz; Eselsbrücke GOLD-MARK). Eine metabolische Azidose mit normalem AG (8–12) ist hyperchlorämisch: Diarrhö, renale tubuläre Azidose, Infusion von Kochsalzlösung. Ein niedriger AG (<3–6) meist durch Hypoalbuminämie; auch Hyperkalzämie/Hypermagnesiämie, Lithium, IgG-Myelom (kationische Paraproteine), Bromid/Pseudohyperchlorämie. Bei Hypoalbuminämie Korrektur AG_corr = AG + 2.5×(4.0 − Albumin) verwenden. Quellen: Kraut CJASN 2007, Figge 1998, MDCalc. Mit Blutgasen und Klinik interpretieren. Keine medizinische Beratung. - [Eingerückte Liste zu ASCII-Baum](https://elysiatools.com/de/tools/ascii-tree-from-indented-list): Wandelt eine eingerückte hierarchische Liste (2/4 Leerzeichen oder Tab; optionale Präfixe -, *, 1.) in einen kopierbaren ASCII-Verzeichnisbaum um. Zwei Stile: Unicode-Rahmen und klassisches ASCII. Schalter für vollständige Führungslinien, nachfolgende Leerzeichen und Blätter in Klammern. - [Data-URI-Generator](https://elysiatools.com/de/tools/data-uri-generator): Konvertiert Dateien in Data URIs (Base64 oder prozent-kodiert), um Bilder, Schriftarten und Ressourcen direkt in HTML, CSS oder Markdown einzubetten - [Konverter fuer verschluesseltes PDF](https://elysiatools.com/de/tools/encrypted-pdf-converter): Oeffnet geschuetzte PDFs mit dem richtigen Passwort und exportiert sie als Markdown, JSON oder Text - [Jupyter-Notebook-Linearizer für reproduzierbare Skripte](https://elysiatools.com/de/tools/jupyter-notebook-to-reproducible-script-linearizer): Konvertiert .ipynb in Python mit # %% und erkennt ungeordneten, versteckten oder gelöschten Zustand - [Markdown-zu-PDF-Konverter](https://elysiatools.com/de/tools/markdown-to-pdf-converter): Markdown-Dateien in PDF-Dokumente mit Formatierung, Syntaxhervorhebung und Stil konvertieren ## Beispiele - [Android Java Bildverarbeitungsbeispiele](https://elysiatools.com/de/samples/android-image-processing-java): Android Java Bildverarbeitungsbeispiele einschließlich Lesen/Schreiben, Skalierung und Formatkonvertierung - [Android Kotlin Bildverarbeitungsbeispiele](https://elysiatools.com/de/samples/android-image-processing-kotlin): Android Kotlin Bildverarbeitungsbeispiele einschließlich Lesen/Schreiben, Skalierung und Formatkonvertierung - [Android Java Dateioperationsbeispiele](https://elysiatools.com/de/samples/android-file-operations-java): Android Java Dateioperationsbeispiele einschließlich Textdatei-Lesen/Schreiben, Datei-Kopieren/Verschieben, Verzeichnisdurchlauf und Dateivalidierung - [Android Kotlin Dateioperationsbeispiele](https://elysiatools.com/de/samples/android-file-operations-kotlin): Android Kotlin Dateioperationsbeispiele einschließlich Textdatei-Lesen/Schreiben, Datei-Kopieren/Verschieben, Verzeichnisdurchlauf und Dateivalidierung ## Verwandte Inhalte - [Textfall-, Encoding- und Normalisierungs-Konvertierungs-Tools](https://elysiatools.com/de/hubs/text-convert): Vergleichen Sie Textfall-Konvertierung, Zeichenbreiten-Konvertierung, Encoding-Konvertierung, Quoted-Printable-Verarbeitung und Inline-Textnormalisierung in einem Hub. - [Markdown-Export-, OCR- und Dokumentkonvertierungs-Tools](https://elysiatools.com/de/hubs/markdown-convert): Vergleichen Sie Markdown-zu-PDF-, PDF-zu-Markdown-, OCR-, Slide-Export- und strukturierte Markdown-Konvertierungs-Tools in einem Hub für Dokumentations- und Publishing-Workflows. - [Text-Tools](https://elysiatools.com/de/hubs/text-utility): Entdecken Sie 33 text-Tools für utility-Workflows und vergleichen Sie ähnliche Utilities schnell. - [Textanalyse-, Lesbarkeits- und Inhaltsinspektions-Tools](https://elysiatools.com/de/hubs/text-analyze): Vergleichen Sie Textstatistik, Spracherkennung, Lesbarkeitsbewertung, Sentimentanalyse, Moderationsprüfung und Musteranalyse in einem Hub.