Those are just images generated by a website like shields.io (but other websites offer similar services)
For example these badges (From Typewriter extension):
Are achieved with this Markdown code:
[![MIT license](https://img.shields.io/badge/license-MIT-blue.svg)](https://github.com/clarkwinkelmann/flarum-ext-typewriter/blob/master/LICENSE.md) [![Latest Stable Version](https://img.shields.io/packagist/v/clarkwinkelmann/flarum-ext-typewriter.svg)](https://packagist.org/packages/clarkwinkelmann/flarum-ext-typewriter) [![Total Downloads](https://img.shields.io/packagist/dt/clarkwinkelmann/flarum-ext-typewriter.svg)](https://packagist.org/packages/clarkwinkelmann/flarum-ext-typewriter) [![Donate](https://img.shields.io/badge/paypal-donate-yellow.svg)](https://www.paypal.me/clarkwinkelmann)
Their website documents all the available options to customize a badge image https://shields.io/