User Interface Configurations

You can customize the appearance of the Incorta webapp to reflect the name of your organization by using your own CSS styles. Using a custom CSS file allows you to add custom:

• Logos
• Watermarks
• Backgrounds
• Fonts
• Colors

Add Custom CSS File

Use the following steps to add a customized CSS file:

1. Navigate to the following directory: <INSTALLATION_PATH>IncortaNode/runtime/webapps/ROOT/css
2. Create the custom.css file if it does not exist. Exact name is mandatory.
3. Paste your CSS style code in the file and save it.
4. Restart Incorta.

Edit Custom CSS Properties

Login Background Image

1. Place the image file in the css folder with this exact name: login_bg.jpg
2. Add this string to the css file:

.inc-login__right-pane {
   background-image: url(“login_bg.jpg”);
   background-repeat: no-repeat;
   background-size: cover;
}

Resize or Reposition Image

background-size: 50%;
background-position: center;
background-color: ##{COLOR}## !important;
Replace the ##{COLOR}## with the color of the image background.

Header color

Add this string to the css file (color ‘green’ is for example)

header.header-nav{
   background-color: green !important;
}

Logo

1. Place the image file in the css folder with this exact name: logo.png.
2. Add the following string to the css file:

.header-nav .header-logo span {
       content:url(logo.png);
}
Custom text beside logo.

Add this string to the css file:

.header-nav .header-logo {
       display: flex;
}
.header-nav .header-logo:after {
   content:‘[text]’ !important;
       padding-top: 15px;
       color: white;
}
Replace [text] with the desired text

Customize Themes for Incorta

Incorta allows individual users to set their default dashboard color theme. The Dark Theme setting changes the interface background to dark mode and is useful for presenting Incorta dashboards on large screens or if you simply prefer a dimmer background in low-light settings.

To change your theme settings, you must first Enable Custom Themes from the CMC to make the dark theme option available in your user profile settings.

Enable Custom Themes as Default Configuration

1. In the navigation bar, select Clusters.
2. In the cluster list, select a cluster name.
3. In the canvas tabs, select Cluster Configurations.
4. In the panel tabs, select Default Tenant Configurations.
5. In the left pane, select Incorta Labs.
6. In the right pane, toggle Enable Custom Themes.
7. Select Save.

Enable Custom Themes for Specific Tenant

1. In the navigation bar, select Clusters.
2. In the cluster list, select a cluster name.
3. From the canvas tab select Tenants to view the list of tenants.
4. Select Configure for the Tenant you want to configure.
5. Select Incorta Labs from the left pane.
6. Toggle Enable Custom Themes on in the right pane. The switch will turn blue to indicate this setting has been enabled.
7. Select Save to apply your changes.

Enable Dark Theme

Once the Custom Themes setting is turned on in CMC you can enable Dark Theme from your profile settings.

1. Select Profile (profile icon) from the navigation bar to open your profile settings.
2. Select the User to open their profile menu.
3. Select the Appearance tab from the Edit User drawer.
4. Toggle on the Dark Theme switch.

The setting will go into effect immediately and your dashboard’s color theme will automatically transition to a dark interface.

Dark Theme Limitations

The dark theme is not available throughout the entire user interface. For example, when you are editing an insight, table, or join, or viewing schema table details, the screen will revert back to the light theme. Once you have exited from the unsupported sections of the user interface (analyzer, schema designer, table or join editor) your screen will return to the dark theme.