Компилятор SCSS и Sass

Скомпилируйте вставленные фрагменты SCSS/Sass или локальные файлы .scss/.sass прямо в браузере. Ваша таблица стилей не загружается, не регистрируется и не отправляется в API.

Нажмите, чтобы выбрать файл SCSS/Sass, или перетащите его сюда.

Вы также можете вставить SCSS/Sass прямо в редактор ниже.

0 байт

0 байт

Готово

Компиляция, встроенная в браузер

Компиляция выполняется локально с использованием официальной реализации Dart Sass. Никакие таблицы стилей не отправляются на серверы Convertr.

Ввод фрагмента и файла

Вставьте частичный SCSS, полные таблицы стилей, вложенные правила, переменные, примеси или загрузите локальный файл .scss.

Безопасное измерение

В аналитике используются только сегменты размера и сокращения. SCSS источник, переменные, примеси и имена файлов остаются вне телеметрии.

FAQ: конвертер файлов Convertr

Мой SCSS загружен на Convertr?

Нет. Компилятор SCSS работает локально с браузером JavaScript. Вставленные SCSS и выбранные файлы не отправляются на серверы Convertr.

Что происходит, когда SCSS имеет синтаксическую ошибку?

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

Поддерживает ли это @import или удаленные зависимости?

Нет. Для обеспечения скорости, автономной доступности и конфиденциальности в этом браузерном компиляторе отключены удаленный импорт и доступ к файловой системе.

Компилятор SCSS

Скомпилируйте поддерживаемый синтаксис SCSS в CSS с помощью встроенного компилятора браузера.

Ввод
Исходный код SCSS плюс опции стиля вывода.
Вывод
Скомпилированный CSS или диагностика компилятора.
Реальные ограничения
Компилятор браузера не разрешает произвольные импорты проектов, не выполняет плагины сборки и не гарантирует соответствие другой версии Sass.
Конфиденциальность и обработка данных
Исходный код SCSS плюс параметры стиля вывода обрабатываются в этой вкладке браузера. Convertr не получает и не хранит его; закрытие или перезагрузка страницы очищает рабочее состояние, если только инструмент явно не предлагает локальную загрузку.

Как использовать этот инструмент

  1. Укажите исходный код SCSS плюс опции стиля вывода в элементах управления инструмента.
  2. Выберите настройки, которые влияют на составленные CSS или диагностику компилятора, а затем запускайте инструмент.
  3. Проверьте скомпилированный CSS или диагностику компилятора перед копированием или загрузкой.

Распространенные причины сбоев

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

Полезный пример

Скомпилируйте переменную $brand и вложенное правило .button hover в расширенный или сжатый CSS.