Customization
The Swing widget is built using Tailwind CSS scoped by the ID #swing
and CSS variables. You can override the default styles by overriding these CSS variables and/or by targeting the #swing
class names.
Primary color
First get your primary color in the HSL color space. Then set the --color-primary
CSS variable to your primary color
:root {
/* hue saturation lightness */
--color-primary: 88 181 126;
}
#swing .dark {
/* hue saturation lightness */
--color-primary: 88 181 126;
}
Additional theming
Need to change any additonal colors? Please reach out to us on Discord and we'll help you out.