Skip to main content

Theming

Which products support theming?

We are in the process of rolling out theming to all Signicat products. For details, see Which products support theming?.

About theming​

The Signicat Theming service allows you to configure the appearance of the content that is presented to your end-users, so that you can provide a cohesive user experience and conform with your company's branding guidelines.

With our Theming service, you can determine:

  • The placement of a custom logo.
  • The placement and size of the headers.
  • The background colour or image.
  • The alignment of the widget.
  • The alignment of the content.
  • The colour palette used for the background, headers and buttons.
  • The border curvature.
  • The font.
Are themes the same as graphical profiles?

With the new Theming service, you can do everything and more that you could do previously with the Graphical profiles editor.

Which products support theming?​

  • eID Hub
    Graphical profiles for MitID

    It is not possible to use Theming service with MitID. If you want to customise the graphical profile for MitID, you can use the Advanced graphical profile (add-on) instead.

  • ID Document and Biometric Verification
  • Signicat Mint
  • MobileID
  • Electronic Signature API
    Note
    • If you are using the Enterprise Electronic Signature API, then we rely on our Graphical profiles editor. To order or modify a graphical profile for the Electronic Signature API, you can contact your key account manager.
    • If you are using the Express Electronic Signature API, then please refer to the Theming guide in the Express Signature documentation.

Built-in accessibility​

End-user applications that you build using our Theming service have built-in accessibility that meets WCAG standards, as we embed accessibility best practices such as ARIA roles and keyboard navigation directly within each component. This ensures an accessible and consistent user experience across all environments where these components are used.

How does theming work?​

You can create custom themes with the Theming service in the Signicat Dashboard, which can be configured to your requirements.

Note

Themes do not affect the appearance of the Signicat Dashboard, only the appearance of the content that is presented to your end-users.

  • A theme can be created on an account level, and can be applied on an account or domain level.
  • You can only apply one theme at an account level. This becomes the default theme for the children of that level.
    What does this mean?

    This means that if you set the theme at an account level, then any domain under this account gets the theme automatically applied.

  • You can apply one or more themes at a domain level.

What access rights do I need?​

In order to work with the Theming service, you need to ensure that you also have a role which provides you with the minimum level of access on an account level, such as the Account Management Account Viewer role. This is because themes are applied at an account and/or domain level.

This applies to the theme-related roles listed below, which have to be applied at an account level:

  • Theme Editor
  • Theme Admin
  • Theme Viewer
What does this mean?

For example, in order to use the Theme Editor role to create and update a theme, you also need at least a basic read-only account level role, such as Account Management Account Viewer.

Without a role that gives you the minimum amount of access, you are not able to create and update the theme.

Get started with the Theming service​

You can create and manage themes in the Signicat Dashboard. To do this:

  1. Go to Signicat Dashboard > Branding > Theming.
  2. In the top navigation bar, use the dropdown menu next to your organisation name to select the account that you want to make changes to.
Success!

You are now in the account theming section, where you can see the default theme setting. From here, you can customise the theme for the selected account.

How to create a new theme​

To create a new theme:

  1. In the Theming service, click the + Add new button.
  2. Populate the fields in the dialog box, then click the Create button.
Success!

You have now created a new theme. This theme is now selectable from the Selected theme dropdown menu.

How to customise a theme​

Once you have created a theme, you can customise it to your requirements.

Important

You must ensure that you are compliant with Web Content Accessibility Guidelines(WCAG) regarding contrast between font colours and other elements.

  1. In the Theming service, use the Selected theme dropdown menu to select the theme that you want to edit.
  2. Click the Edit theme button.
  3. Make your desired changes to the theme using the editor. You can customise the:
    • Header
    • Widget
    • Colours
    • Borders
    • Background
    Maximum file size

    If used, the maximum logo and background image size is 5MB.

  4. Once you have finished editing your theme, click the Save changes button.

How to apply a theme​

Apply a theme on an account level​

  1. In the Theming service, you can see the name of the account you are currently making changes to in the Accounts and domains dropdown menu.
    1. Click the Use different themes for domains toggle button.
    2. Select the domain you want to make changes to from the Accounts and domains dropdown menu.
  2. Use the Selected theme dropdown menu to select the theme that you want to apply to the account or domain.
  3. Click the Apply theme button.

Apply a theme on a domain level​

If you have created domains under your account, then it is possible to apply a different theme to each domain that you have. If you want to do this, you must use the following order:

  1. Set the custom theme for the account.
  2. Set the custom theme for the domain(s).

If you set the account theme after the domain themes instead, then the account theme will overwrite the saved custom domain themes and your work will be lost.

We recommend that you create two distinct themes first. By doing this, you prevent any loss of work if you decide that you want to apply one theme at an account level and one theme for a specific domain.

To set a custom theme for a domain:

  1. In the Theming service, click the Use different themes for domains toggle button.
  2. Select the domain you want to make changes to from the Accounts and domains dropdown menu.
  3. Use the Selected theme dropdown menu to select the theme that you want to apply to the account or domain.
  4. Click the Apply theme button.

Apply multiple themes for a domain​

If you have created domains under your account, then it is possible to apply multiple themes to each domain that you have. To do this:

  1. In the Theming service, click the Use different themes for domains toggle button.
  2. Select the domain you want to make changes to from the Accounts and domains dropdown menu.
  3. Click the Use multiple themes for this domain toggle button.
  4. Select the the theme that you want, then click the + Add theme button. Repeat this step for every theme that you want to apply. The added themes will appear in the list below.
  5. Once you are happy with your selection, click the Apply multiple themes button to proceed.

Specify a theme per request​

If you have multiple themes for a domain or account, then you can specify which theme you want to use per request.

The way you do this depends on which authentication protocol you use.

OpenID Connect​

To specify a theme when using OpenID Connect, you must use the acr_values URL parameter.

Example: Specify a theme with OIDC
acr_values=theme:xfwfyv1340

In this example,xfwfyv1340 is the theme ID. You can find and copy the required theme ID from the Themes service in the Signicat Dashboard.

Want to learn more?

To learn more about ACR values, see acr_values in our the OIDC documentation.

Authentication REST API​

To specify a theme when using the Authentication REST API, you must use the optional themeId field when creating authentication sessions.

Example: Specify a theme with the Authentication REST API
"themeId": "agkaa12"

In this example,agkaa12 is the theme ID. You can find and copy the required theme ID from the Themes service in the Signicat Dashboard.

Want to learn more?

To learn more about this, see our Authentication REST API reference documentation.

SAML 2.0​

Information will follow soon.

Last updated:
On this page