The verify page is hosted by Authentica, but how it looks is yours. Page Studio in the portal lets you restyle it — or rebuild its markup entirely — without touching your integration code. client_id, secret, POST /session and GET /session/{sessionId} are unaffected.
Page Studio lives at https://authentica-merge.t2.sa/theme-studio, or Page Studio in the portal sidebar.

How a theme reaches your users

Your work is a draft until you publish it. Live users keep seeing the current published page the whole time.
1

Edit

Change the page in Page Studio. Saving stores a draft against your client_id.
2

Preview

Preview opens a real sandbox verification session rendered on your draft — the flow actually runs, so you can step through code boxes, resend countdown and the success state. The preview link is valid for 15 minutes.
3

Publish

Publish promotes the draft to live. The page is validated first; if anything required is missing, publishing is refused and you get the list of problems.
4

Remove theme

Remove theme discards your customization and returns the app to the Authentica default page.

Three ways to edit

Full visual editing on a live rendering of your page: colours, layout, branding and appearance, no code required. Open it from Design Studio inside Page Studio.

The contract

Authentica owns the behaviour; you own the markup and CSS. The verification logic is served by us and binds to a handful of elements by id. Keep those hooks and you can do anything else.

Free to change

CSS, layout, wording, element order, extra markup of your own, fonts, colours, spacing, and right-to-left direction. url() in your CSS is restricted to three sources — anything else is rewritten to none: To pull in a Google Fonts stylesheet, use a <link> to fonts.googleapis.com rather than @import url(…).

Fixed

  • No <script> tags. A theme is HTML and CSS only — we supply the logic. Scripts are rejected.
  • Exactly one element marked data-authentica-widget. This is the slot the verification card lives in.
  • Unique ids.
  • The “SECURED BY Authentica” footer (class="secured") stays inside the card, with its wording intact. Restyle it freely.

Two ways to build the page

Leave the widget element empty:
Authentica drops its own card in at render time and your CSS still styles it. You do not have to supply any of the required ids below. Style the page around the slot and you are done.The one catch: the slot must be genuinely empty. If a required id appears anywhere outside it, the page is rejected — that pattern means a card got left behind on the page rather than inside the slot.

Required ids (client card only)

Miss one and the flow visibly breaks, so the page is refused.

Optional ids

Remove these and the page still works — you just lose the feature, and you get a warning rather than an error.

State classes

The logic adds and removes these, so the names are fixed. What they look like is entirely yours.
Style .hidden so it genuinely hides. If nothing in your card uses it, every step of the flow can appear at once — Page Studio warns you about this.

Common rejections

Who can edit what

You can theme the apps your account owns. Platform admins can theme any app.

Next