Skip to content
AtmosphericX LogoWritten By: KiyoWx
Last Updated: Mar 5th, 2026


Palette Widget


The palette widget dynamically adjusts a block's color theme based on event priority. It reacts to weather (Wx) events, PulsePoint events, and custom triggers defined in the themes section of your events.jsonc configuration. Each theme specifies a primary (RGB) and secondary (RGB) color scheme, allowing you to create clear visual distinctions between event levels. You can access the widget at /widgets/palette, or further customize its behavior using URL parameters as demonstrated below.

Please keep in mind that the palette widget should be rarely used as the strings widget can cover most if not all of the theme backgrounds with the setElementThemed parameter.

Theme Priority

Theme priority works by having the top most event (top most) take precedence over subsequent events.

Parameter Rules

  • ? is used when starting a query string in a URL.
  • & is used to append additional parameters to an existing query string.
  • true or false should be supplied depending on whether the parameter expects a boolean value.

Always follow the expected type and position of the parameter when constructing the widget settings.

Example URL: /widgets/example?setWidgetParameter1=value1&setWidgetParameter2=value2

Global Parameters

All global parameters are supported. Visit Global Parameters to see a full list of all the global parameters. However setElementThemed is forced to true.

Local Parameters

Below are default / optional parameters you can use with the palette widget. Please be sure to follow the default value type convention.

setElement

  • Description: The element to select for handling the widget. This is forced upon the widget and can't be changed.
  • Default (DOM): widget-container
  • Example: N/A

Examples

Example 1
  • Prompt: Make a rounded box with about 125px of roundness that has a smooth color changing animation and animates for 3.5 seonds.
/widgets/palette?setBorderRadius=125&setBackgroundAnimated=true&setAnimationStartDuration=3.5
Example 2
  • Prompt: Make a palette widget that uses the secondary color in the theme.
/widgets/palette?setThemeType=secondary