Adding Your Own Branding
You can add your own branding information, such as logos and corporate colors, to productize MapD Immerse.
You can add a customStyles
JSON object to the servers.json
configuration file with the following available elements. See Using servers.json to Configure Immerse Options for more information on modifying the servers.json
file.
Element | Description |
---|---|
buttonPrimaryColor |
Button color when inactive |
buttonSecondaryHighlightColor |
Button color when hovering |
colors |
Hexadecimal color definitions used in charts |
custom |
Custom colors, requires 11 or more colors |
logoURL | URL to your logo. This must be a browser-accessible http(s) URL, not a file system path. |
ordinal |
4 scales, 1 or more colors each scale |
quantitative |
4 scales, 1 or more colors each scale |
secondaryButtonColor |
Button color when pressed |
solid |
Solid colors, requires 8 or more colors |
title |
Text displayed in the browser tab. |
Notes
- There are no visual design guarantees when using a large number of colors. For example, visual elements might bleed beyond borders or have an unexpected layout.
- Custom styles do not affect the settings for charts or dashboards saved before the custom styles are defined. However, you can edit existing charts and replace the colors in use to colors in your custom palette.
Example
json
{
"customStyles": {
"logoURL": "https://media.tickleknucklebee.com/pictures/pitchers/pitcher.jpg",
"buttonPrimaryColor": "#E5BC2C",
"buttonSecondaryColor": "#4D88B4",
"buttonSecondaryHighlightColor": "#4D88B4",
"colors": {
"solid": [
"#ce006f",
"#b50061",
"#9b0053",
"#8a004a",
"#7b003a",
"#ffb370",
"#fc9e4a",
"#ff8f2a"
],
"custom": [
"#ce006f",
"#b50061",
"#9b0053",
"#8a004a",
"#7b003a",
"#ffb370",
"#fc9e4a",
"#ff8f2a",
"#fc8113",
"#ff7800",
"#ff7800"
],
"ordinal": [
[
"#2F1510",
"#ECFE71"
],
[
"#2F1510",
"#665A79",
"#C7F779"
],
[
"#2F1510",
"#5D3546",
"#5B7797",
"#39BFA9",
"#ECFE71"
],
[
"#2F1510",
"#492328",
"#5D3546",
"#674C68",
"#626889",
"#5086A2",
"#36A3AD",
"#39BFA9",
"#67D99A",
"#A5EE84",
"#ECFE71"
]
],
"quantitative": [
[
"#2F1510",
"#3D1B1B",
"#492328",
"#542B36",
"#5D3546",
"#644057",
"#674C68",
"#665A79",
"#626889",
"#5B7797",
"#5086A2",
"#4395A9",
"#36A3AD",
"#31B2AD",
"#39BFA9",
"#4CCCA3",
"#67D99A",
"#84E48F",
"#A5EE84",
"#C7F779",
"#ECFE71"
],
[
"#2F1510",
"#ECFE71"
],
[
"#FF3030",
"#FF8000",
"#FFF68F"
],
[
"#9bb0ff",
"#e0e5ff",
"#ffc38b"
]
]
}
}
}