Viewer style

Set the color and style of the environment.

Description

The following parts of the environment can be styled:

  1. The background.
  2. The menus.
  3. The tooltips.
  4. The hotspots.

Background

Using the background-color parameter you can change the background color of the environment.

Values

Default value

The default value for background-color is set in the Content Management System (CMS).

Possible values

Possible values are hex color codes (lowercase), without the leading hash-tag (#). The value transparent is also supported.

Example

  <iframe
      src="https://vulp.studio/foxmountain/cup/nl-NL/?background-color=404040"
      allow="xr-spatial-tracking; fullscreen"
      referrerpolicy="no-referrer-when-downgrade"
      width="600"
      height="510"
      frameBorder="0"
  ></iframe>

Using the menu-color parameter you can change the color of the menu buttons. This sets the color for both the fill and the stroke of the menu buttons. Using menu-fill-color and menu-stroke-color it is possible to set a color for either the fill or the stroke.

Values

Default value

The default value for menu-color is ffffff (white). Both menu-fill-color and menu-stroke-color default to menu-color.

Possible values

Possible values are hex color codes (lowercase), without the leading hash-tag (#).

Example

  <iframe
      src="https://vulp.studio/foxmountain/cup/nl-NL/?menu-color=ffc800"
      allow="xr-spatial-tracking; fullscreen"
      referrerpolicy="no-referrer-when-downgrade"
      width="600"
      height="510"
      frameBorder="0"
  ></iframe>

Hotspot

Using the hotspot-color parameter you can change the color of the hotspots.

Values

Default value

The default value for menu-color is ffffff (white). Both menu-fill-color and menu-stroke-color default to menu-color.

Possible values

Possible values are hex color codes (lowercase), without the leading hash-tag (#).

Example

  <iframe
      src="https://vulp.studio/foxmountain/cup/nl-NL/?hotspot-color=ffc800&amp;hotspot-button=1"
      allow="xr-spatial-tracking; fullscreen"
      referrerpolicy="no-referrer-when-downgrade"
      width="600"
      height="510"
      frameBorder="0"
  ></iframe>

Tooltip

The tooltips can be styled using the following two paramers:

  1. Using the tooltip-background-color parameter you can change the the background color of the tooltips.
  2. Using the tooltip-text-color parameter you can change the text color of the tooltip.

Values

Default value

The default value for tooltip-background-color is ffffff (white). The default value for tooltip-text-color is 000000 (black).

Possible values

Possible values are hex color codes (lowercase), without the leading hash-tag (#).

Example

  <iframe
      src="https://vulp.studio/foxmountain/cup/nl-NL/?tooltip-text-color=ffffff&amp;tooltip-background-color=000000"
      allow="xr-spatial-tracking; fullscreen"
      referrerpolicy="no-referrer-when-downgrade"
      width="600"
      height="510"
      frameBorder="0"
  ></iframe>
🗗 Open in new tab