Сдвигайте рамку влево
Центр окрашенной визуальной массы находится правее центра SVG. После компенсации синяя ось должна совпасть с осью области.
transform: translateX(-6.71%);
Рабочий инструмент
Центр визуальной массы — на ось области
В этом SVG визуальная масса смещена вправо на 6,71% L. Поэтому рамку логотипа нужно двигать на столько же влево.
Область размещенияпоправка зафиксирована
защитное поле
слева 214 px · 31%справа 244 px · 36%
центр областицентр рамки SVGцентр визуальной массы
Три правила.
Без вариантов.
Проценты — правило, пиксели — только контрольное значение для текущего размера.
Ровняйте по высоте прописных
Не используйте геометрический центр line-height. Посадка зависит от cap-height конкретного шрифта и проверяется в реальном размере.
display: inline-flex;
align-items: center;
align-items: center;
Текст — по началу «ВТБ»
Левое размещение допустимо. Абзац под логотипом начинается по буквенной части, а не по левому краю знака.
padding-left: 35.3%; /* от L */
--vtb-optical-x−6,71% L · −14,8 px @ 220Горизонтальная компенсация SVG--vtb-clearspace29,1% L · 64 px @ 220Рабочее защитное поле инструмента--vtb-word-start35,3% L · 77,7 px @ 220Начало буквенной части в мастер-SVGМетод: рабочий optical token рассчитан как контраст-взвешенный центроид заполненных контуров предоставленного SVG. Для официального брендбука значение следует подтвердить контрольной визуальной калибровкой.