Этот механизм не от вас зависит ...а этот механизм сделан в браузере
К примеру Yandex браузер (писали в поддержку хотели узнать how do it) реализована пиксельное изъятие цвета
А вот Opera Chrome(Визуальные Вкладки)Firefox берут фавикон за основу ... делают минискриншот + название сайта с фавикон ...это сложно - в общем напишите в поддержку каждого браузера и вам опишут механизм
https://codepen.io/topicstarter/pen/rPpZoa такие вещи на SVG делаются как в лужу Пукнуть ... что и даёт нам возможность для работы с canvas и анимировать каждую деталь по отдельности
три блока друг под другом и в каждом блоке два элемента внутри каждого иконка и текст но разные отступы и каждый блок flex justify-content:space-bwtween, главный блок имеет относительное позиционирование и форма круга абсолютно отцентрированная