Layout

Icon Launcher Button

Geometry

CSS Variable	Description	preset1	Default
--theme-icon-launcher-backdrop-diameter	button diameter incl. border thickness		60px
--theme-icon-launcher-icon-width	enclosed icon size		40px
--theme-icon-launcher-distance-from-sticky-border	distance from sticky border		20px

Example:

:root {
    --theme-icon-launcher-distance-from-sticky-border: 50px;
    --theme-icon-launcher-backdrop-diameter: 100px;
}

Text Launcher Button

Geometry

CSS Variable	Description	preset1	Default
--theme-text-launcher-border-radius	round button corners		5px
--theme-top-text-padding
--theme-text-launcher-distance-from-sticky-border	distance from sticky border		0px

Colours

CSS Variable	Description	preset1	example
--theme-background-image	round button corners	⍻	linear-gradient(#e66465, #9198e5)

Style

CSS Variable	Description	preset1
--livesupport-theme-font-family	font family of label text	✓

Either Launcher Button

Geometry

CSS Variable	Description	preset1	Default
--badge-height	height of the unread-lines indicator
--theme-launcher-border-thickness	draw a border around the launcher button		2px

Colours

CSS Variable	Description	preset1
--theme-color	text, icon and border colour	✓
--theme-background-color	background	✓
--theme-hover-opacity	on mouse hover effect	⍻

Style

CSS Variable	Description	preset1
--theme-badge-font-family	font family of the unread-lines indicator

Attention Grabber Button

Geometry

CSS Variable	Description
--theme-icon-launcher-distance-from-sticky-border	When used with an Icon Launcher, it's distance from sticky border affects the positioning of the Attention Grabber Button too

---

1. can be changed by the preset ↩↩↩↩↩↩↩