Theming the midgard panels
The same six query params restyle both /login and /register. Pass them on the URL you redirect users to — there's no separate config step.
Parameters
| Name | Meaning | Format | Example |
|---|---|---|---|
font |
font-family stack | letters, digits, spaces, commas, quotes, hyphens; ≤120 chars | Inter,system-ui |
fg |
text color | hex: #rgb, #rgba, #rrggbb, #rrggbbaa |
%23eeeeee |
bg |
page background color | hex | %23111827 |
btn |
primary button color | hex | %237c3aed |
radius |
card / input / button rounding (px) | integer 0–32 | 10 |
title |
replaces the card heading | free text, trimmed to 60 chars | Sign+in+to+Acme |
Example
https://midgard.fly.dev/login ?title=Sign+in+to+Acme &font=Inter,system-ui &bg=%23111827 &fg=%23eeeeee &btn=%237c3aed &radius=10 &return=https://acme.fly.dev/
Behavior
- All values are strictly validated client-side; invalid input is silently dropped, so there's no HTML/CSS-injection risk.
- Button text color is auto-derived from
btnfor contrast — no separate param needed. - When no colors are passed the panel honors the browser's
prefers-color-scheme, so unstyled embeds still look native in light and dark. - Theme params are preserved on the cross-link between
/loginand/register, along with any?return=you pass. - There's no
css=orlogo=knob. For deeper customization, iframe midgard and style the surrounding chrome.
The JSON API is documented at /docs (openapi.json).