Brand the consent screen
Customize Auth's OAuth2 consent UI
When an OAuth2 client requests user consent, Auth renders a consent screen showing the requesting app and the requested scopes. The default styling is generic; you'll usually want it branded.
Where the consent screen lives
auth/src/app/consent/page.tsx is the Next.js page rendered when Auth receives a consent_challenge.
It typically shows:
- The requesting client's name (from Hydra's consent request context).
- The list of scopes being requested.
- "Accept" / "Decline" buttons.
- "Remember my choice" checkbox.
Forking Auth
Ionize's customization model: fork Auth, edit, build, deploy your fork's image.
cd auth
# Edit auth/src/app/consent/page.tsx
bun build
podman build -t ghcr.io/your-org/auth:custom .
podman push ghcr.io/your-org/auth:custom
# Update compose.prod.yml to reference your image; redeploy.What you can customize
- Logo, colors, font.
- Wording (e.g. "Authorize" instead of "Accept").
- Per-scope explanations (a tooltip explaining what
read:widgetsallows). - Skip-consent flag honoring (see below).
Per-client styling
If you want different branding per OAuth2 client (e.g. "Dashboard CIAM" looks different from a third-party app):
- Read the client's
metadatafield from the consent request. - Set up per-client branding (logo URL, color) in the metadata when creating the client.
- Render conditionally.
hydra update client <id> --endpoint http://localhost:3103 \
--metadata '{"branding": {"logo": "https://...", "primary_color": "#abc123"}}'Skip consent for first-party clients
Ionize's Auth supports metadata.skip_consent. When true, the consent step auto-accepts without rendering. Use only for first-party apps where consent is implicit:
hydra update client dashboard-iam-client --endpoint http://localhost:4103 \
--metadata '{"skip_consent": true}'Dashboard and Site clients in Ionize are auto-configured with skip_consent: true during the Deploy Applications wizard step.
Showing "remember" sensibly
By default, "Remember my choice" is checked but the user can uncheck. If users uncheck, the next login re-prompts.
For first-party clients, you generally want to auto-remember without an option to opt out. Hide the checkbox in your fork:
{!isFirstParty && (
<Checkbox name="remember">Remember my choice</Checkbox>
)}