The filter component can be used in a lot of different use cases to help users reduce the amount of data displayed and find the information they need faster. These guidelines show you the different elements that compose the filter component.
The filter is composed of a header, main body with set of UI elements and actions.
There are three types of filter headers: basic header, round toggled header and square header. Always placed at the top part of the filter.
Here are the main elements that you can combine to build a filter specific for your financial application.
Use the apply and cancel default actions. The Apply action is required to filter the related content.
How to use filter in the apps
Want to know how to use filter in a real app? Here is an example of the developer portal API catalog.