# Карточка спеков Figma iOS Android pt dp sp (адаптивный дизайн) Переводит px из Figma в правильные платформенные единицы и генерирует спеку для разработчиков: iOS pt (@1x/@2x/@3x с рендером px на каждый масштаб), Android dp/sp (таблица рендера mdpi…xxxhdpi и масштаб шрифта), web rem/vw со сниппетом clamp(); аудит минимальных сенсорных целей (44pt iOS / 48dp Android / 44px и 24px WCAG) с пометкой классов окон Material и брейкпоинтов Tailwind. > Каноническая страница: https://elysiatools.com/ru/tools/figma-ios-android-pt-dp-sp-responsive-design-spec-card - **Категория:** Design - **Ключевые слова:** figma в код, pt, dp, rem, сенсорная цель, плотности экрана ## Обзор Проверенные константы: iOS pt = px ÷ масштаб (@1x=1/@2x=2/@3x=3, историческая база 163ppi); Android dp = px ÷ плотность (mdpi 160=1x, hdpi 240=1.5x, xhdpi 320=2x, xxhdpi 480=3x, xxxhdpi 640=4x), sp добавляет пользовательский масштаб шрифта (шаги 0.85/1.0/1.15/1.3, Android 14+ нелинейно до 200%); web rem = px ÷ корневой размер (по умолчанию 16px), vw = px ÷ вьюпорт × 100, clamp(MIN, VAL, MAX) = max(MIN, min(VAL, MAX)). Сенсорные цели: 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. Адаптив: классы окон Material compact <600dp / medium 600–839dp / expanded ≥840dp; брейкпоинты Tailwind 640/768/1024/1280/1536px. ## Входные данные - **Значение px из Figma** (number): e.g. 48 - **Масштаб макета** (select) - **Роль элемента** (select) - **Корневой шрифт (px)** (number) - **Ширина вьюпорта (px)** (number) ## Когда использовать - Когда нужно передать размеры элемента из Figma в iOS pt и Android dp. - Когда требуется проверить размер кнопки или другого элемента по минимальным требованиям сенсорных целей. - Когда нужно получить значения rem, vw и ориентиры для адаптивной верстки. ## Как это работает - Введите значение из Figma в px и выберите масштаб макета: 1x, 2x или 3x. - Укажите роль элемента: общий размер, сенсорная цель или размер текста. - При необходимости задайте корневой размер шрифта и ширину вьюпорта. - Получите HTML-карточку со значениями pt, dp, rem и vw, таблицей рендера по плотностям и соответствующими проверками. ## Сценарии использования - Передача размеров кнопок, полей и отступов из макета Figma в мобильную разработку. - Проверка доступности интерактивных элементов перед передачей макета разработчикам. - Подготовка web-значений rem и vw для гибкой верстки на заданном вьюпорте. ## Частые вопросы ### Какие единицы рассчитывает инструмент? Он рассчитывает iOS pt, Android dp, значения для текста с учетом масштаба шрифта, а также web rem и vw. ### Как масштаб Figma влияет на результат? Значение px делится на выбранный масштаб: 1 для 1x, 2 для 2x и 3 для 3x. ### Какие значения используются для rem и vw? rem рассчитывается через корневой размер шрифта, по умолчанию 16px, а vw — через ширину вьюпорта, по умолчанию 1440px. ### Что проверяет режим «Сенсорная цель»? Он сравнивает размер с минимумами 44pt для iOS, 48dp для Material и 44px и 24px по WCAG. ### Какие параметры адаптивности указываются в карточке? Карточка отмечает классы окон Material compact, medium и expanded, а также брейкпоинты Tailwind. ## Связанные инструменты - [Сравнение хеш-алгоритмов](https://elysiatools.com/ru/tools/hash-algorithm-comparator): Хеширует один и тот же вход с помощью MD5, SHA-1, SHA-256, SHA-512, BLAKE2b и BLAKE3 и сравнивает их: длину, hex/Base64-дайджест, статус безопасности (взломан/современный) и относительный бенчмарк скорости. Полезно для обучения, выбора алгоритма и проверки контрольных сумм. - [Декомпозиция дерева OKR и KPI](https://elysiatools.com/ru/tools/okr-tree-decomposer): Декомпозирует Objective компании в Отдел → Команда → Личное, с весом/целью/фактом по узлам; взвешенный прогресс поднимается наверх. Визуальное дерево + Markdown. - [Калькулятор анионной разницы сыворотки (AG)](https://elysiatools.com/ru/tools/anion-gap-calculator): Рассчитывает анионную разницу сыворотки AG = Na⁺ − Cl⁻ − HCO₃⁻ (ммоль/л), с опцией формулы с K⁺ и коррекцией по альбумину. Повышенный AG (≈ >12) указывает на накопление неизмеренных анионов (лактат, кетоновые тела, метанол/этиленгликоль, салицилаты, почечная недостаточность; мнемоника GOLD-MARK). Метаболический ацидоз с нормальным AG (8–12) — гиперхлоремический: диарея, канальцевый ацидоз, инфузия солевых растворов. Низкий AG (<3–6) чаще из-за гипоальбуминемии; также гиперкальциемия/гипермагниемия, литий, миелома IgG (катионные парапротеины), бромид/псевдогиперхлоремия. При гипоальбуминемии используйте коррекцию AG_corr = AG + 2.5×(4.0 − альбумин). Источники: Kraut CJASN 2007, Figge 1998, MDCalc. Толковать с газами крови и клиникой. Не медицинская консультация. - [Список с отступами в ASCII-дерево](https://elysiatools.com/ru/tools/ascii-tree-from-indented-list): Превращает иерархический список с отступами (2/4 пробела или таб; префиксы -, *, 1. опциональны) в копируемое ASCII-дерево каталогов. Два стиля: Unicode-рамка и классический ASCII. Переключатели: полные направляющие линии, хвостовые пробелы, листья в скобках. - [Генератор Data URI](https://elysiatools.com/ru/tools/data-uri-generator): Преобразует файлы в Data URI (Base64 или процентное кодирование) для встраивания изображений, шрифтов и ресурсов прямо в HTML, CSS или Markdown - [Конвертер зашифрованного PDF](https://elysiatools.com/ru/tools/encrypted-pdf-converter): Открывает защищенные PDF с правильным паролем и экспортирует их в Markdown, JSON или текст - [Линеаризатор воспроизводимого скрипта Jupyter Notebook](https://elysiatools.com/ru/tools/jupyter-notebook-to-reproducible-script-linearizer): Преобразует .ipynb в Python со знаками # %% и выявляет нарушенное, скрытое и удалённое состояние - [Конвертер Markdown в PDF](https://elysiatools.com/ru/tools/markdown-to-pdf-converter): Преобразование файлов Markdown в PDF-документы с форматированием, подсветкой синтаксиса и стилями ## Примеры - [Примеры Обработки Изображений Android Java](https://elysiatools.com/ru/samples/android-image-processing-java): Примеры обработки изображений Android Java включая чтение/сохранение, масштабирование и преобразование формата - [Примеры Обработки Изображений Android Kotlin](https://elysiatools.com/ru/samples/android-image-processing-kotlin): Примеры обработки изображений Android Kotlin включая чтение/сохранение, масштабирование и преобразование формата - [Примеры Файловых Операций Android Java](https://elysiatools.com/ru/samples/android-file-operations-java): Примеры файловых операций Android Java включая чтение/запись текстовых файлов, копирование/перемещение, обход директорий и валидацию файлов - [Примеры Файловых Операций Android Kotlin](https://elysiatools.com/ru/samples/android-file-operations-kotlin): Примеры файловых операций Android Kotlin включая чтение/запись текстовых файлов, копирование/перемещение, обход директорий и валидацию файлов ## Связанные материалы - [Инструменты конвертации регистра, кодировки и нормализации текста](https://elysiatools.com/ru/hubs/text-convert): Сравните в одном хабе конвертацию регистра, ширины символов, кодировок, работу с quoted-printable и встроенную нормализацию текста. - [Инструменты экспорта, OCR и конвертации Markdown](https://elysiatools.com/ru/hubs/markdown-convert): Сравните инструменты Markdown в PDF, PDF в Markdown, OCR, экспорта слайдов и структурной конвертации Markdown в одном хабе для публикации документации. - [Инструменты Text](https://elysiatools.com/ru/hubs/text-utility): Изучите 33 инструментов text для сценариев utility и быстро сравните близкие утилиты. - [Инструменты анализа текста, читаемости и проверки содержания](https://elysiatools.com/ru/hubs/text-analyze): Сравните в одном хабе текстовую статистику, определение языка, оценку читаемости, анализ тональности, модерацию и анализ шаблонов.