Разница между box-shadow и filter: drop-shadow при создании теней заключается в том, что box-shadow задаёт тень блоку, а функция drop-shadow() делает тень по контурам элемента, учитывая прозрачные участки. 4
Некоторые другие различия:
- Производительность. При отрисовке в браузере фильтра drop-shadow используется аппаратное ускорение, что улучшает производительность, в то время как при использовании box-shadow дополнительного ускорения нет. 1
- Фон. Тень блока снизу, созданная с помощью фильтра, будет выводиться под элементом, не учитывая фон, в то время как box-shadow будет учитывать сплошной фон элемента. 3
- Неоднородная граница. Если граница неоднородная (например, пунктирная), фильтр будет учитывать это, а box-shadow нет. 3