Frontend Options Reference

Configuration Usage

Frontend options are configured inside app-config.static.json (or passed dynamically). They control UI behavior, branding, themes, OAuth defaults, and page cosmetics across login, registration, and user-facing views.

---

All Namespaces (61)assets (7)content (9)form (1)oauth (2)privilege (4)sidebar (3)theme (33)user (2)All Typesbooleanobjectstring

Showing 61 of 61 options

Option Name	Type	Default	Description
oauth.client-id OAuth Client ID	string	—	Specifies the Client ID of the default OAuth client. Use query parameter `clientId` to use a different client.
oauth.redirect-uri OAuth Redirect URI	string	—	Specifies the default Redirect URI after login. Use query parameter `redirect` on login to use a different Redirect URI.
user.account-creation.require-email-verification User Account Creation Require Email Verification	boolean	true	Specifies if email verification is required while signing up in the service. Also modify `user.account-creation.require-email-verification` in your backend config.
user.account-creation.enable-invite-only User Account Creation Enable Invite Only	boolean	false	Specifies if accounts can be created only using an invite code. Also modify `user.account-creation.enable-invite-only` in your backend config.
privilege.can-create-account Can Use Create Account	boolean	true	Specifies if users can signup into the service. If false, users can be created using the bulk create api at `users/admin-api/create` or `users/client-api/create`. Also modify `privilege.can-create-account` in your backend config.
privilege.can-reset-password Can Use Reset Password	boolean	true	Specifies if users can reset their passwords using forgot password option.
privilege.can-use-phone-number Can Use Phone Number On Signing Up	boolean	false	Specifies if users can signup with phone numbers. Note that Liquid currently does not support verification of phone numbers. By default, all phone numbers are marked as unverified. Also modify `privilege.can-use-phone-number` in your backend config.
privilege.can-use-existing-session-in-login Can Use Existing Session In Login	boolean	false	Specifies if users can be directly sent to authorization if there is an existing session with the server.
assets.favicon-uri Favicon URI	string	images/app-icon-mini-light.png	Specifies the URL for the favicon.
assets.mini-icon-light Mini Icon (Light Mode)	string	images/app-icon-mini-light.png	Specifies the URL for the icon in the top left of the screens.
assets.mini-icon-dark Mini Icon Dark (Dark Mode)	string	images/app-icon-mini-dark.png	Specifies the URL for the icon in the top left of the screens.
assets.header-icon-light Header Icon (Light Mode)	string	images/app-icon-header-light.png	Specifies the URL for the icon that appears in the header of the screen.
assets.header-icon-dark Header Icon (Dark Mode)	string	images/app-icon-header-dark.png	Specifies the URL for the icon that appears in the header of the screen.
assets.sidebar.backdrop-image-light Backdrop Image (Light Mode)	string	images/bg.jpg	Specifies the URL for the sidebar background image.
assets.sidebar.backdrop-image-dark Backdrop Image (Dark Mode)	string	images/bg.jpg	Specifies the URL for the sidebar background image.
content.app-name App Name	string	Liquid	Specifies the name of the application.
content.app-tagline App Tagline	string	Your tagline here.	Specifies the tagline of the application.
content.sidebar.enabled Enable Sidebar	boolean	true	Specifies the sidebar can be shown.
content.sidebar.content-enabled Enable Sidebar Content	boolean	true	Specifies the sidebar content can be shown.
content.sidebar.intro.title1 Sidebar Intro Title 1	string	Plug & Play	Specifies the content for Title 1 of the sidebar intro.
content.sidebar.intro.title2 Sidebar Intro Title 2	string	with any project.	Specifies the content for Title 2 of the sidebar intro.
content.terms-and-conditions-url Terms and Conditions URL	object	null	Specifies the URL for terms and conditions of your application.
content.privacy-policy-url Privacy Policy URL	object	null	Specifies the URL for privacy policies of your application.
content.sidebar.intro.description Sidebar Intro Description	string	Focus on writing your app logic while liquid handles the same old authentication logic 🔒	Specifies the content for Description of the sidebar intro.
form.input.can-display-placeholder Form Input Can Display Placeholder	boolean	true	Specifies if input fields in forms can display placeholder.
sidebar.width Sidebar Margin	string	35%	Specifies width of the sidebar.
sidebar.margin Sidebar Margin	string	0px	Specifies the margin for sidebar. Single value margin in any unit.
sidebar.border-radius Sidebar Border Radius	string	0px	Specifies the border radius for sidebar.
theme.app-font-face Theme - App Font Face	object	null	Specifies the Font Face to be used in static pages.
theme.app-font-url Theme - App Font URL	object	null	Specifies the Font URL associated with the given Font Face to be used in static pages.
theme.app-font-base-size Theme - App Font Base Size	string	15px	Specifies the base Font size to be used in static pages.
theme.light.background-color Theme - Background Color (Light Mode)	string	#ffffff	Specifies the page background color.
theme.light.primary-button.height Theme - Primary Button Height (Light Mode)	string	48px	Specifies the height of the submit button in forms.
theme.light.primary-button.color Theme - Primary Button Color (Light Mode)	string	#0E86D4	Specifies the color of the submit button in forms.
theme.light.primary-button.active-color Theme - Primary Button Active Color (Light Mode)	string	#055C9D	Specifies the color of the submit button (when active) in forms.
theme.light.primary-button.text-color Theme - Primary Button Text Color (Light Mode)	string	#ffffff	Specifies the text color of the submit button in forms.
theme.light.primary-button.active-text-color Theme - Primary Button Text Active Color (Light Mode)	string	#ffffff	Specifies the text color of the submit button (when active) in forms.
theme.light.primary-button.error-color Theme - Primary Button Error Color (Light Mode)	string	#ed4337	Specifies the color of the submit button (during error) in forms.
theme.light.primary-button.error-text-color Theme - Primary Button Text Error Color (Light Mode)	string	#ffffff	Specifies the color of the submit button (during error) in forms.
theme.light.primary-button.focus-box-shadow Theme - Primary Button Box Shadow (Light Mode)	string	0 0 0 6px #055C9D4D	Specifies the value for box shadow property of the submit button (when focussed) in forms.
theme.light.primary-button.border-radius Theme - Primary Button Border Radius (Light Mode)	string	30px	Specifies the border radius of the submit button in forms.
theme.light.form.input-border-radius Theme - Form Input Border Radius (Light Mode)	string	7px	Specifies the border radius of the input fields in forms.
theme.light.form.input-use-border Theme - Use Border in Form Input (Light Mode)	boolean	true	Specifies the borders can be used in input fields in forms.
theme.light.form.input-border-color Theme - Form Input Border Color (Light Mode)	string	#c8c8c8	Specifies the border colors used in form input fields.
theme.light.form.input-vertical-padding Theme - Form Input Vertical Padding (Light Mode)	string	4px	Specifies the vertical padding of the input fields in forms.
theme.light.form.input-horizontal-padding Theme - Form Input Horizontal Padding (Light Mode)	string	10px	Specifies the horizontal padding of the input fields in forms.
theme.dark.background-color Theme - Background Color (Dark Mode)	string	#0a0a0a	Specifies the page background color.
theme.dark.primary-button.height Theme - Primary Button Height (Dark Mode)	string	48px	Specifies the height of the submit button in forms.
theme.dark.primary-button.color Theme - Primary Button Color (Dark Mode)	string	#055C9D	Specifies the color of the submit button in forms.
theme.dark.primary-button.active-color Theme - Primary Button Active Color (Dark Mode)	string	#003B73	Specifies the color of the submit button (when active) in forms.
theme.dark.primary-button.text-color Theme - Primary Button Text Color (Dark Mode)	string	#ffffff	Specifies the text color of the submit button in forms.
theme.dark.primary-button.active-text-color Theme - Primary Button Text Active Color (Dark Mode)	string	#ffffff	Specifies the text color of the submit button (when active) in forms.
theme.dark.primary-button.error-color Theme - Primary Button Error Color (Dark Mode)	string	#ed4337	Specifies the color of the submit button (during error) in forms.
theme.dark.primary-button.error-text-color Theme - Primary Button Text Error Color (Dark Mode)	string	#ffffff	Specifies the color of the submit button (during error) in forms.
theme.dark.primary-button.focus-box-shadow Theme - Primary Button Box Shadow (Dark Mode)	string	0 0 0 6px #003B734D	Specifies the value for box shadow property of the submit button (when focussed) in forms.
theme.dark.primary-button.border-radius Theme - Primary Button Border Radius (Dark Mode)	string	30px	Specifies the border radius of the submit button in forms.
theme.dark.form.input-border-radius Theme - Form Input Border Radius (Dark Mode)	string	7px	Specifies the border radius of the input fields in forms.
theme.dark.form.input-use-border Theme - Use Border in Form Input (Dark Mode)	boolean	true	Specifies the borders can be used in input fields in forms.
theme.dark.form.input-border-color Theme - Form Input Border Color (Dark Mode)	string	#27272a	Specifies the border colors used in form input fields.
theme.dark.form.input-vertical-padding Theme - Form Input Vertical Padding (Dark Mode)	string	4px	Specifies the vertical padding of the input fields in forms.
theme.dark.form.input-horizontal-padding Theme - Form Input Horizontal Padding (Dark Mode)	string	10px	Specifies the horizontal padding of the input fields in forms.