← Все инструменты для текста

Генератор CSS-фильтров

Размытие, яркость, контраст и другое на вашей картинке с кодом CSS-фильтра.

  • Бесплатно
  • Без регистрации
  • Работает на любом устройстве

Около Генератор CSS-фильтров

Загрузите собственную картинку и попробуйте фильтры blur, brightness, contrast, grayscale, sepia, hue-rotate, saturate и invert с ползунками. Инструмент записывает соответствующую строку CSS filter. Фильтры применяются в написанном порядке, поэтому blur и затем brightness могут выглядеть иначе, чем brightness и затем blur.

Как пользоваться инструментом «Генератор CSS-фильтров»

  1. Выберите изображение на устройстве; оно остаётся в вашем браузере.
  2. Двигайте ползунки размытия, яркости, контраста, оттенков серого и других фильтров.
  3. Скопируйте строку CSS filter, соответствующую предпросмотру.

Чем полезен этот инструмент?

Другие названия

Частые вопросы

Как сделать изображение чёрно-белым в CSS?

Примените к изображению filter: grayscale(100%). Используйте меньший процент для частично выцветшего вида и сочетайте с contrast для более сильных тонов.

Важен ли порядок фильтров?

Да. CSS применяет фильтры слева направо, поэтому контраст с последующей яркостью может выглядеть иначе, чем яркость с последующим контрастом. Сохраняйте порядок, который даёт инструмент.

Изменит ли фильтр мой исходный файл изображения?

Нет. Фильтр — это лишь инструкция CSS, которую браузер применяет при показе изображения. Исходный файл остаётся нетронутым.

Инструмент «Генератор CSS-фильтров» бесплатный?

Да. Инструмент «Генератор CSS-фильтров» на Toolipedia бесплатный: без регистрации и водяных знаков.

Это безопасно?

Да. Все вычисления выполняются в браузере, и ничего из введённого не отправляется на наш сервер.

Работает ли это на телефоне?

Да. Работает в любом современном браузере на Android и iPhone, а также на планшетах и компьютерах. Ничего не нужно устанавливать.

Нужна ли учётная запись?

Нет. Просто откройте страницу и пользуйтесь. Ни регистрации, ни электронной почты не нужно.

Можно ли разместить Генератор CSS-фильтров на моём сайте?

Да. Нажмите кнопку «Встроить на свой сайт» под инструментом, чтобы скопировать короткий фрагмент кода и вставить его на страницу. Это бесплатно, аккаунт не нужен, и инструмент продолжает работать внутри вашей страницы.

Похожие инструменты