Несколько способов создания полупрозрачных изображений в веб-дизайне:

• Использование свойства opacity в CSS. 2 Оно позволяет задать прозрачность элемента, к которому применяется. 2 Значения, которые можно использовать в качестве аргумента, изменяются в пределах от 0 (полная прозрачность) до 1 (непрозрачность). 2
• Использование PNG-картинки. 2 В графическом редакторе предварительно готовят однотонный полупрозрачный рисунок и сохраняют его в формате PNG-24. 4 Особенностью этого формата является поддержка 256 уровней прозрачности. 4 После чего рисунок добавляют в качестве фона через свойство background. 4
• Клетчатые изображения. 2 Метод заключается в создании клетчатого фона, в котором цветные квадратики чередовались с прозрачными. 2 В результате применения такой картинки в качестве background получают псевдопрозрачный фон. 2
• Использование свойства box-shadow. 1 Свойство box-shadow с параметрами внутренней тени позволяет создать эффект прозрачности фонового изображения, обходясь без использования opacity. 1
• Использование техники спрайтов. 1 Для оптимальной загрузки заранее создают изображения с разной прозрачностью. 1