Для браузера 1px = 1dp, если в
<head> страницы прописан
<meta name="viewport" content="width=device-width, initial-scale=1.0">
Т.е. браузер использует css-пиксели — это те же «dp», — которые на экранах преобразуются в device pixels: 1 css пиксель может равняться 2 пикселям экрана, когда сайт отображается на экране с двойной плотностью (множитель @2x) и т.д.
Ума не приложу, какую проблему вы пытаетесь решить. Но мне кажется, что вы наоборот создаете проблему. Не вижу смысла привязываться к ppi устройства, если только вы не делаете «экранную линейку».
«Dp» и формула пересчета предназначена скорее для дизайнеров, которые рисуют растровые картинки для сайтов и приложений. Но если вы верстаете с использованием svg, то у вас не возникнет никаких проблем. Делайте svg со множителем @1x, и в браузере всё правильно отмасштабируется.
Средний
Простой
