By default, widget filters are a predefined color on your dashboard. Optionally, you can customize the color properties for how widget filters appear. This widget behavior is managed through the WIDGETS pane of Builder, and enables you to control the aesthetic details of your widget filters.
This guides describes how you can define the color for widget filters. Specifically, we will customize the filter colors to match the default styling of the map.
If you have a CATEGORY, HISTOGRAM, OR TIME-SERIES widget, you can define the solid COLOR for widget filters in CARTO Builder. The defined color is not related to how the selected values appear on your dashboard, it is only applicable to the color properties of the widget filters before values are selected.
For this example, let's customize the filter color of all of the widgets to match the default color of the Brooklyn Poverty layer.
Unzip the template .carto file packaged from "Download resources" of this guide, and import it to your account to create the map. Builder opens with Brooklyn Poverty as the first map layer and Street Conditions as the second map layer.
Note the default filters colors on your dashboard.
From the WIDGETS pane in Builder, select Date to edit the details of the Time-Series widget.
From the Behavior options, click the COLOR to open the color picker for the widget filters and enter
#374c70 as the Hex input color.
The custom color appears as the filter color for the Time-Series widget.
Click once on the Time-Series widget to display the range selector, and click and drag to select the start and end date.
Note how the custom filter color no longer appears, as values have been selected from the widget. Click CLEAR SELECTION to view the default filter colors again.
To apply the same filter color
#374c70 to the rest of the widgets on your dashboard, repeat these steps by editing each of the widgets from the WIDGETS pane in Builder.
In this case, the filter colors are visually consistent with the default dashboard styling. This is especially noticeable on the published version of the map.
Go ahead and apply widget Auto style to visualize how the poverty data exposes the neighborhoods that are most likely to gentrify next.
We would love to hear from you! Was it easy to understand? Do you need more information? Let us know.