Modifying the UI with whitelabeling.¶
Netmaker UI allows resellers to whitelabel and customize branding by building a custom docker image with the below environment variables set.
Open the Dockerfile.standalone file and set the following environment variables (recommended to use logos with an aspect ratio of 4:3):
VITE_PRODUCT_NAME: The name of the product. This is the name that will appear in the UI.
VITE_TENANT_LOGO_DARK_URL: Logo to be used in dark mode.
VITE_TENANT_LOGO_LIGHT_URL: Logo to be used in light mode.
VITE_TENANT_LOGO_DARK_SMALL_URL: Small varient of logo to be used in dark mode. eg: when sidenav is collapsed (optional).
VITE_TENANT_LOGO_LIGHT_SMALL_URL: Small varient of logo to be used in light mode. eg: when sidenav is collapsed (optional).
VITE_TENANT_LOGO_ALT_TEXT: Alternative text for logo.
VITE_TENANT_FAVICON_LOGO: Favicon to use in the web browser’s tile bar or tab. Defaults to light logo if not specified. Recommended to use a 32x32px .ico image
VITE_TENANT_PRIMARY_COLOR: UI primary color. Replace this with your brand color. eg: red, green, “#F00”, “#00FF00” (Hex values need quoting)
You could use a URL to the respective logos or put the logos in the /public directory, then build the docker image.
For more information on how to go about whitelabelling, reach out to us at https://www.netmaker.io/contact