Skip to main content
Tallysight widgets support light and dark modes, and apply workspace branding automatically through a CSS variable system. You control appearance through your workspace settings and optional per-widget configuration — no manual style overrides needed.

​
Light and dark mode

Widgets default to light mode. The active theme for a widget is set through your workspace branding settings in the Tallysight dashboard. When you configure a dark-mode palette for your workspace, widgets embedded with that workspace slug will render in dark mode automatically.

​
CSS variable system

Widget colors are resolved through a three-tier fallback chain. When a widget renders, it looks up each color in priority order and uses the first value it finds: This means your workspace branding takes effect across all widgets automatically, and you can still override individual widgets when you need a one-off exception.

​
Color properties

Each workspace can customize 12 color properties, and each property has a separate value for light and dark mode — 24 values in total. Border colors Background colors Text colors
Theming is applied at the workspace level. All widgets that reference the same workspace slug share branding automatically — you set your colors once, and every widget picks them up without any additional configuration.