Customize the theme & UI

Our mobile SDKs allow changing the theme color that is used for borders and buttons. We do not allow changing fonts or other colors and we try to match the native platform UIs.

Further customization of the consent notice can be done by displaying your own custom consent notice instead of the standard SDK notice.

Color

You can modify the theme color in your didomi_config.json file:

{
"theme": {
"color": "#000000"
}
}

The theme color is used for borders of notices and popups and for highlighted buttons.

The linkColor attribute controls the color of all the links in the banner/popup.

{
"theme": {
"linkColor": "#000000"
}
}

Buttons

We use two different types of buttons:

  • Regular buttons (regularButtons): our basic button used throughout the consent workflow (Learn More, Disagree, etc.). Those buttons are grey by default.

  • Highlighted buttons (highlightButtons): used when we want to emphasize an action. Those buttons use the theme color by default.

{
"theme": {
"buttons": {
"regularButtons": { // Learn more/disagree/disagree to all buttons.
"backgroundColor": "#eeeeee",
"textColor": "#999999",
"borderColor": "#222222",
"borderWidth": "1",
"borderRadius": "3"
},
"highlightButtons": { // Agree/save/agree to all buttons.
"backgroundColor": "#c2272d",
"textColor": "#ffffff",
"borderColor": "#c2272d",
"borderWidth": "1",
"borderRadius": "3"
}
}
}
}

Custom notice

If you want to further customize the notice in your app, you can use your own custom notice to replace the standard Didomi SDK notices (banner or popup). Read more in our dedicated documentation.