CasdoorMarketplace
Submit

Midnight · Sign-in theme

Midnight

A dark sign-in page with a soft glow in your accent color behind a frosted card. CSS only, so organization admins can install it.

Verified by CasdoorDarkCSS only
Apply this themeView source
Midnight sign-in page

What it sets

Themedark
Border radius12px
Form positionCenter
Custom CSSYes
Custom CSS MobileYes

Everything is on the application's UI Customization tab in Casdoor, so you can keep adjusting it after applying the theme.

Apply it to an application

  1. Enter the application below, adjust the theme's settings, and copy the JSON.
  2. In the Casdoor console, open Applications, edit that application, click Import JSON at the top, paste the JSON and click OK.
  3. Click Save. The sign-in page uses the theme from the next visit.
{
  "name": "<application name>",
  "organization": "<organization>",
  "themeData": {
    "themeType": "dark",
    "colorPrimary": "#8b5cf6",
    "borderRadius": 12,
    "isCompact": false,
    "isEnabled": true
  },
  "formOffset": 2,
  "formCss": "<style>\n.login-background {\n  background: radial-gradient(1100px 560px at 50% -12%, color-mix(in srgb, #8b5cf6 38%, transparent), transparent 70%), #09090f;\n}\n.login-panel {\n  background: rgba(22, 22, 34, 0.82);\n  border-color: rgba(255, 255, 255, 0.08);\n  box-shadow: 0 24px 64px rgba(0, 0, 0, 0.5);\n  backdrop-filter: blur(12px);\n}\n</style>",
  "formCssMobile": "<style>\n.login-background {\n  background: radial-gradient(600px 360px at 50% -10%, color-mix(in srgb, #8b5cf6 34%, transparent), transparent 70%), #09090f;\n}\n</style>"
}

More sign-in themes

View all

Aurora

Sign-in theme

A pastel mesh of color tinted by your accent behind a frosted glass card, with soft rounded fields and a gradient button. CSS only, so organization admins can install it.

LightGlassGradient

Backdrop

Sign-in theme

Your own picture behind the whole page, dimmed a little, with a frosted glass card on top. It comes with a dusk mountain scene; give it any image address to use yours. Organization admins can install it.

DarkBackground imageGlass

Bare

Sign-in theme

Nothing but the form: no card, no background, a small left-aligned logo, quiet text tabs, hairline fields and a round button, with plenty of white space. CSS only, so organization admins can install it.

LightMinimalNo card