Skip to main content

Customization

The Web SDK supports two dimensions of customization: language and visual theme.

Language

Configure the language of informational messages in the capture frames via the setLocale method. Use the LocaleTypes enum:

  • LocaleTypes.PT_BR — Portuguese (Brazil)
  • LocaleTypes.ES_MX — Spanish (Mexico)
  • LocaleTypes.ES_ES — Spanish (Spain)
  • LocaleTypes.EN_US — English (USA)
import {
UnicoCheckBuilder,
LocaleTypes
} from "unico-webframe"

unicoCameraBuilder.setLocale(LocaleTypes.EN_US);
info
  • A remote activation may be required to use this feature. If you wish to use it, notify your project manager or Unico support.
  • If not configured, the SDK uses Portuguese as the default language.

Refer to API Reference > Enums for the full list of supported LocaleTypes values.

Theme

Customize the capture frame using the UnicoThemeBuilder. Create an instance and invoke the methods that customize each property of the capture frame:

const unicoTheme = new UnicoThemeBuilder()
.setColorSilhouetteSuccess("#0384fc")
.setBackgroundColor("#dff1f5")
.setColorText("#0384fc")
.setBackgroundColorComponents("#0384fc")
.setColorTextComponents("#dff1f5")
.setBackgroundColorBoxMessage("#fff")
.setColorTextBoxMessage("#fff")
.setBackgroundColorButtons("#0384fc")
.setColorTextButtons("#dff1f5")
.setColorCancelButton("#0384fc")
.setColorProgressBar("#0384fc")
.setFontFamily("Arial, sans-serif") // v3.19.2+
.setHtmlPopupLoading(`<div style="position: absolute; top: 45%; right: 50%; transform:
translate(50%, -50%); z-index: 10; text-align: center;">Carregando...</div>`)
.build();

After generating the theme object, pass it to setTheme:

unicoCameraBuilder.setTheme(unicoTheme);
setHtmlPopupLoading

The setHtmlPopupLoading parameter is specific to the document capture flow.

Customization scope

No other customization dimensions are available beyond what UnicoThemeBuilder exposes. If you need a fully proprietary UI, refer to the Capture Standard option (headless API integration).