theme
parameter controls the overall appearance of elements that cannot be individually configured, such as the Dots logo or the date picker icon. The available themes are:
light
(default)dark
Variable | Description |
---|---|
backgroundColor | Background color of the flow. |
primaryTextColor | Color of texts used in titles and labels. |
secondaryTextColor | Color of secondary texts used in sub-labels and buttons. |
tertiaryTextColor | Color of tertiary texts, such as the default payout method indicator or the Visit dashboard link. |
primaryColor | Primary color of the flow theme, such as button hovers or highlights. |
tabBackgroundColor | Background color of the rail tab. |
tabHoverBackgroundColor | Background color of the rail tab when the cursor hovers over it. |
tabBorderColor | Border color of the rail tab. |
tabHoverBorderColor | Border color of the rail tab when the cursor hovers over it. |
buttonBackgroundColor | Background color of action buttons located at the bottom of each flow page. |
buttonTextColor | Text color of action buttons located at the bottom of each flow page. |
buttonHoverTextColor | Text color of action buttons when the cursor hovers over them. |
buttonHoverBackgroundColor | Background color of action buttons when the cursor hovers over them. |
buttonDisabledBackgroundColor | Background color of action buttons when they are disabled. |
buttonDisabledTextColor | Text color of action buttons when they are disabled. |
inputBackgroundColor | Background color of inputs such as checkboxes or text fields. |
inputBorderColor | Border color of inputs. |
inputPlaceholderColor | Placeholder color of inputs. |
borderRadius | Border radius of buttons, tabs, icons, and inputs. |
theme
and variables
, converting the configurations to a JSON string.?styles={url_encoded_config}
query parameter to the Flow link when attaching it to an iframe.