Как затемнить фон картинку в css

Как затемнить фоновое изображение?

Я могу ее довольно просто осветлить при наведении через свойство opacity , но можно ли подобным образом сделать ее темнее?

Отслеживать
задан 28 апр 2022 в 13:30
81 6 6 бронзовых знаков

1 ответ 1

Сортировка: Сброс на вариант по умолчанию

.block < --size: 180px; width: var(--size); height: var(--size); background: url(https://picsum.photos/200/300) no-repeat center / cover; transition: filter 0.2s ease-in; >.block:hover

.block < --size: 180px; width: var(--size); height: var(--size); background: url(https://picsum.photos/200/300) no-repeat center / cover; position: relative; >.block::before < width: 100%; height: 100%; display: block; content: ''; position: absolute; background-color: rgba(0, 0, 0, 0.6); opacity: 0; transition: opacity 0.2s ease-in; >.block:hover::before

Отслеживать
ответ дан 28 апр 2022 в 13:34
Михаил Камахин Михаил Камахин
8,674 2 2 золотых знака 16 16 серебряных знаков 55 55 бронзовых знаков
спасибо! пошел изучать фильтры
28 апр 2022 в 13:49
@levensta второй пример с просто opacity
28 апр 2022 в 19:37

• css
• background-image

Важное на Мете

Похожие

Подписаться на ленту

Лента вопроса

Для подписки на ленту скопируйте и вставьте эту ссылку в вашу программу для чтения RSS.

Дизайн сайта / логотип © 2023 Stack Exchange Inc; пользовательские материалы лицензированы в соответствии с CC BY-SA . rev 2023.11.15.1019

Нажимая «Принять все файлы cookie» вы соглашаетесь, что Stack Exchange может хранить файлы cookie на вашем устройстве и раскрывать информацию в соответствии с нашей Политикой в отношении файлов cookie.

Бесплатный инструмент для затемнения фото

Поделиться

Загрузить фотографию

· Максимальный размер загрузки: 30MB, 10000px x 10000px
· Поддерживаемые форматы JPEG, WEBP, PNG

Сделай свои фотографии темнее с помощью искусственного интеллекта

С помощью инструмента для затемнения фото ты можешь бесплатно затемнить фотографию без потери качества! Если ты хочешь затемнить фото без особых усилий и убедиться, что результат будет идеальным, тебе стоит попробовать наш инструмент для затемнения фото с ИИ! Если ты задаешься вопросом, как затемнить фотографию, у нас есть простое решение для тебя: наш инструмент с ИИ затемнит любую фотографию с хорошим качественным результатом. Без ИИ фотография была бы смазанной и пикселированной, но с помощью ИИ тебе просто нужно загрузить фотографию, которую ты хочешь затемнить, и ты получишь гладкую и четкую затемненную фотографию!

Почему мы предлагаем сервис затемнения фотографий бесплатно?

В PhotoAiD мы разработали множество инструментов для обработки и проверки биометрических фотографий. Мы заметили, что наши инструменты могут быть использованы по себе и мы решили сделать доступ к ним бесплатным 🙂 Мы более чем рады использовать этот инструмент для затемнения фото, или попробуй другие наши инструменты? которыми мы поделились. Если тебе нравится этот инструмент — расскажи друзьям о нас. И если тебе нужно обновить твое паспортное фото или фото визы, пользуйся photooaid.com, чтобы сэкономить время и деньги 🙂

Проверяй с другими нашими инструментами!

• Убрать тень
• Удалить фон
• Расширение изображений
• Инструмент для затемнения фото
• Негатив фото
• Инструмент для размытых фотографий
• Инструмент для круглой обрезки фото
• Обрезать фото
• Инструмент Пипетка для выбора цвета
• Фото редактор для черно-белого фото
• Повернуть фото
• Осветлитель фото
• Устройство для раскраски фото
• Устройство для вращения фото

Как затемнить картинку, но текст оставить белым?

Подскажите пожалуйста
Хочу затемнить картинку, а текст оставить белым ( то есть чтобы было видно текст на фоне картинки ), как это можно сделать?

Пробовал ставить opacity 0.5 на .header .main-top, но затемняется и текст тоже

• Вопрос задан более трёх лет назад
• 1629 просмотров

Комментировать

Решения вопроса 2

background-image: linear-gradient(rgba(0,0,0,0.5),rgba(0,0,0,0.5)), url(assets/images/tickets/./business01.jpeg);

Ответ написан более трёх лет назад

Комментировать

Нравится 2 Комментировать

Осветление или затемнение областей изображения

Инструмент «Осветлитель» и инструмент «Затемнитель» позволяют осветлить или затемнить области изображения. Эти инструменты основаны на традиционном методе темной комнаты и служат для коррекции экспозиции на определенных областях отпечатка. Фотографы снижают освещение печатаемой области для получения более светлых снимков (осветление) или увеличивают время экспозиции, чтобы получить более темные отпечатки (затемнение). Чем больше инструменты «Осветлитель» и «Затемнитель» применяются к какой-либо области, тем, соответственно, светлее или темнее она становится.

Примечание.

Применение инструмента «Осветлитель» или инструмента «Затемнитель» к заднему плану изменяет информацию об изображении без возможности восстановления. Чтобы отредактировать изображения, не изменяя исходных данных, работайте над дубликатом слоя. Сведения о дублировании слоев см. в документе Основы работы со слоями.

Выберите инструмент «Осветлитель» или «Затемнитель» .

На панели выбора параметров выберите кончик кисти и настройте параметры кисти.

В меню «Диапазон» на панели выбора параметров выберите один из следующих вариантов: