Skip to main content

Dynamic JSON Badge

The Dynamic JSON Badge allows you to extract an arbitrary value from any JSON Document using a JSONPath selector and show it on a badge.

Query Parameters
url string — REQUIRED

The URL to a JSON document

Example: https://github.com/badges/shields/raw/master/package.json
query string — REQUIRED

A JSONPath expression that will be used to query the document

Example: $.name
prefix string

Optional prefix to append to the value

Example: [
suffix string

Optional suffix to append to the value

Example: ]
style string

One of: flat (default), flat-square, plastic, for-the-badge, social

Example: flat
logo string

One of the named logos (bitcoin, dependabot, gitlab, npm, paypal, serverfault, stackexchange, superuser, telegram, travis) or simple-icons. Simple-icons are referenced using icon slugs which can be found on the simple-icons site or in the slugs.md file in the simple-icons repository.

Example: appveyor
logoColor string

The color of the logo (hex, rgb, rgba, hsl, hsla and css named colors supported). Supported for named logos and Shields logos but not for custom logos. For multicolor Shields logos, the corresponding named logo will be used and colored.

Example: violet
label string

Override the default left-hand-side text (URL-Encoding needed for spaces or special characters!)

Example: healthiness
labelColor string

Background color of the left part (hex, rgb, rgba, hsl, hsla and css named colors supported). The legacy name "colorA" is also supported.

Example: abcdef
color string

Background color of the right part (hex, rgb, rgba, hsl, hsla and css named colors supported). The legacy name "colorB" is also supported.

Example: fedcba
cacheSeconds string

HTTP cache lifetime (rules are applied to infer a default value on a per-badge basis, any values specified below the default will be ignored). The legacy name "maxAge" is also supported.

Example: 3600
link string[]

Specify what clicking on the left/right of a badge should do. Note that this only works when integrating your badge in an <object> HTML tag, but not an <img> tag or a markup language.