The Stat Card component is a really simple UI element to quickly display a number from a database, calculated or hardcoded in a card format, allowing you do display some quick data.

All three label properties (Title, Value, Label) support Bindings through Handlebars or JavaScript functions. In the example above you can see this demonstrated in a mixture of ways, there's a calculation happening on an average latitude, there's a number of rows displayed from the database, and there's the current user's firstname displayed as the title.

Adding a Stat Card

The Stat Card is located under Card > Stat Card in the Budibase design section. A wrapping Data Provider is not required as the Stat Card can also display information about the user, or run JavaScript functions. However, if you want to display data from Data Sources you'll need to add the Stat Card as a child of a Data Provider that has the Data Source connected.

Displaying Data

If you want to display data in a Stat Card, you can use Bindings in the Settings Panel. There are three values you can set using Bindings.