Tiny SVGImage compressorGradient fabricUnit ForgeFav IconaStronghold
Русский
РусскийEnglish

Macrulez Toolz — инструменты для разработчиков в браузере

Инструменты для веб-мастеров прямо в браузере.

Шесть бесплатных инструментов: градиенты, сжатие изображений, SVG, единицы CSS, favicon и пароли. Всё считается локально, ничего не уходит на сервер.

Tiny SVG

Векторы без лишнего веса.

Инструмент для оптимизации SVG-кода и уменьшения размера файлов.

Открыть Tiny SVG →

Обзор

Этот оптимизатор SVG поможет вам сократить вес векторной графики, что критически важно для скорости загрузки сайта и SEO. Инструмент удаляет лишние теги, комментарии, метаданные и пробелы, делая код максимально чистым.

Что убираем из SVG

  • Комментарии
  • Метаданные
  • Невидимые элементы
  • Лишние группы
  • Пробелы и пустые теги
  • Слишком длинные пути

Три шага до лёгкого SVG

  1. Загрузите

    Откройте SVG-файл в редакторе.

  2. Сравните

    Превью покажет оригинал и результат, а рядом — процент сжатия и итоговый размер.

  3. Заберите

    Скачайте файл или архив, либо скопируйте код.

Где пригодится

Иконки, логотипы и иллюстрации на сайте — особенно когда SVG-графики много. В отличие от простых конвертеров, здесь вы управляете оптимизацией и видите результат до того, как скачаете файл.

Image compressor

Картинки легче, а качество прежнее.

Сжатие растровых изображений прямо в браузере: MozJPEG, WebP, AVIF, JPEG XL и другие кодеки.

Открыть Image compressor →

Кодеки на выбор

  • MozJPEG
  • Oxipng
  • WebP
  • AVIF
  • JPEG XL
  • QOI

Как это устроено

WASM
кодеки работают на вашем устройстве, прямо в браузере
Локально
ваши изображения не уходят на сервер
До / после
слайдер для сравнения с оригиналом
Пакетно
несколько изображений за один раз

Обзор

Уменьшите вес изображений, чтобы страницы загружались быстрее. Выберите кодек, настройте баланс между качеством и размером и сравните результат с оригиналом, прежде чем сохранять.

Когда нужно сжимать

Интернет-магазины, блоги и лендинги, где картинки тянут вес страницы. Чем меньше размер, тем лучше LCP (Largest Contentful Paint) и выше балл в PageSpeed Insights.

Gradient fabric

Градиенты, которые оживают.

Мощный конструктор CSS-градиентов со слоями, редактором анимации и интуитивным интерфейсом.

Открыть Gradient fabric →

Обзор

Создавайте сложные и красивые градиенты для вашего сайта без написания кода. Наш генератор CSS-градиентов позволяет экспериментировать с цветами, прозрачностью и типами градиентов, получая готовый код в один клик. А встроенный редактор анимации с таймлайном позволяет оживить градиент: расставьте ключевые точки, задайте для них значения, и конструктор плавно проведёт градиент между ними.

Из чего состоит конструктор

Поддержка слоев

Наложение нескольких градиентов друг на друга для создания уникальных эффектов.

Полный контроль

Настройка линейных, радиальных и угловых градиентов.

Живая анимация

Таймлайн с дорожкой для каждого слоя: расставляйте ключевые точки, и градиент плавно меняется между ними. Результат виден мгновенно.

Готовый код

Копирование чистого CSS-кода для вашего проекта, в том числе готовых @keyframes для анимации.

От идеи до CSS

  1. Соберите

    Добавьте слои, выберите тип градиента и настройте цвета, прозрачность и углы.

  2. Оживите

    Включите таймлайн, расставьте ключевые точки и задайте значения — градиент плавно проведёт между ними.

  3. Заберите код

    Скопируйте готовый CSS вместе с @keyframes или скачайте файл.

Для чего

Фоны для кнопок, баннеров, карточек товаров и целых секций сайта, а также живые анимированные фоны, переливающиеся заголовки и заставки. Результат — обычный CSS без JavaScript и сторонних библиотек.

Unit Forge

Из px в rem без калькулятора.

Конвертер CSS-единиц с гибкой настройкой.

Открыть Unit Forge →

Единицы, с которыми работаем

  • px
  • rem
  • em
  • %
  • vw
  • vh
  • vmin
  • vmax
  • pt
  • ch
  • deg
  • ms

Больше двух десятков единиц: длины, углы, время и разрешение. Значения пересчитываются сразу при вводе, а результат можно скопировать в нужной единице, как значение, CSS-переменную или готовое объявление.

Обзор

Быстро и точно переводите значения между px, rem, em, %, vw, vh и другими единицами, чтобы верстка получалась адаптивной и доступной. Инструмент учитывает корневой и родительский размеры шрифта, размеры экрана и родительского блока, а значит, результат совпадает с тем, что увидит браузер. Всё считается прямо в браузере, ваши файлы никуда не отправляются.

Что умеет Unit Forge

  • Умный конвертер

    Введите «24px» прямо в поле: результат считается сразу. Есть история, закреплённые пары единиц и наглядный предпросмотр размера.

  • Массовая конвертация

    Списки значений и CSS-объявления целиком. Счётчик показывает, сколько значений преобразовано, а режим «только изменённые» убирает лишнее.

  • CSS и SCSS файлы

    Загрузите файлы или вставьте код: выберите свойства для обработки. Сравнение «до и после» подсвечивает каждое изменённое значение.

  • Адаптивная типографика

    clamp() для одного значения, плавные размеры между двумя экранами и целая шкала ступеней для заголовков и текста.

  • Из макета в код

    Размер из макета в пикселях превращается в vw, проценты и clamp(), которые масштабируются вместе с шириной экрана.

  • Токены дизайн-системы

    Таблица значений с нужным шагом сетки одним кликом становится CSS-переменными, SCSS-картой или JS-объектом.

Контекст решает

В отличие от простых калькуляторов, Unit Forge учитывает базовый размер шрифта (root), размер родительского элемента, высоту строки и родительский блок. Проценты считаются от шрифта, ширины или высоты в зависимости от CSS-свойства. Настройки, свои пресеты вроде Tailwind или Bootstrap и история сохраняются в браузере.

Из макета в код

Перенесите размеры из Figma: укажите ширину макета и получите vw и clamp(). Соберите адаптивную типографику, токены для дизайн-системы и конвертируйте целые CSS-файлы за один проход.

Fav Icona

Один логотип — все иконки.

Генератор favicon и постера для соцсетей с полным контролем и предпросмотром.

Открыть Fav Icona →

Обзор

Создайте набор иконок (favicon.ico, PNG, Apple Touch Icon) для всех устройств и браузеров, а при желании и постер для превью ссылок в соцсетях. Загрузите изображение, настройте его и получите готовый пакет файлов и HTML-код с тегами для вставки. Для иконок доступны светлая и тёмная темы, свои настройки Apple и Android, а постер можно обрезать, сжать в JPEG, PNG или WebP и увидеть заранее как карточку в Telegram, Facebook и X. Всё работает прямо в браузере: ваши изображения никуда не отправляются.

Что в наборе

  • favicon.ico
  • PNG
  • SVG
  • Apple Touch Icon
  • Web manifest
  • Постер Open Graph
  • Теги og и Twitter
  • HTML-код
  • Запрос для AI-агента

Как получить набор

  1. Загрузите

    Выберите иконку и, если нужно, постер для соцсетей.

  2. Настройте

    Обрежьте, задайте фон, формат и сжатие постера, заполните теги.

  3. Проверьте

    Посмотрите иконку в разных размерах и контекстах, а постер как карточку в мессенджерах и соцсетях.

  4. Подключите

    Скачайте пакет и вставьте HTML-код на сайт или передайте задачу AI-агенту.

Когда пригодится

Запуск нового сайта или ребрендинг: сразу полный набор favicon и красивое превью ссылки в соцсетях. Заметная иконка и постер помогают узнаваемости бренда.

Stronghold

Надёжные пароли без сервера.

Генератор надёжных паролей и парольных фраз с гибкой настройкой и честной оценкой сложности.

Открыть Stronghold →

Пароли не покидают браузер

Генерация и проверка идут полностью в вашем браузере: пароли и фразы не передаются на сервер и нигде не сохраняются. Запоминаются только настройки.

Обзор

Создавайте уникальные и стойкие к взлому пароли для защиты ваших аккаунтов, а также запоминающиеся парольные фразы из слов. Настройте длину, наборы символов, свои символы и исключения, выберите готовый пресет, а оценка в битах и время подбора покажут реальный уровень надёжности. Заодно можно проверить уже существующий пароль и найти в нём слабые места.

Что умеет Stronghold

Пароли и парольные фразы

Случайные пароли любой длины или запоминающиеся фразы из английских слов.

Пресеты и свои правила

Готовые наборы: надёжный, PIN-код, Wi-Fi, легко набрать. Свои символы, исключения и минимум символов каждого вида.

Без путаницы

Исключите неоднозначные символы: «l» и «1», «O» и «0». Удобно, когда пароль приходится вводить вручную.

Честная оценка

Энтропия в битах, уровень надёжности и время подбора пересчитываются сразу и учитывают все ваши ограничения.

Проверка пароля

Вставьте свой пароль: он оценивается прямо в браузере, а повторы, последовательности, годы и слова из словарей подсвечиваются.

Удобная работа

Скройте пароли, обновите один или все, скопируйте или скачайте в TXT, CSV и JSON. Горячая клавиша R обновляет сразу все.

Для чего

Мастер-пароли для менеджеров паролей, пароли для новых аккаунтов, API-ключи и другие случаи, где важна безопасность. Упор на гибкие настройки и наглядную обратную связь — чтобы пароль был одновременно надежным и удобным для запоминания.