Table of Contents

Components CSS Library Index

Abby Updated by Abby

Please note that these classes are for V3 Landbots

CSS classes to manipulate the icon

.LivechatLauncher {
}

.launcher__bubble {
}

.launcher__avatar {
}

.LivechatProactive {
}
(Launcher with custom image)
.is-launcher__avatar{
}

(Move proactive to hover over bubble)
.Proactive__card .Message__message-content{
left: 150px;
}

Basic builder classes

.Header {
}

.Header__Logo {
}

.Background {
}

.Background--image{
}

.Footer {
}

.Body {
}

Button classes


Back button
.BackButton__Button {
}

Back button
.custom-button{
}

Buttons
.input-button{
}

Button content
.input-button-label{
}

Button help text
.input-small-header{
}

Media classes

.MessageMediaBubble{
}
.Media{
}

Miscellaneous

     Input text
.InputTextLong__TextArea{
}
Persistent menu items in header
.is-horizontally-centered{
}
Loader
.lb-loader{
}
Emoji
.is-emoji-button {
}

Rating
.InputRating {
}

Proactive Message Card
.Proactive__card{
margin-left: 100px;
}

Scroll bar
.js-auto-scroll{
overflow: hidden;
}

Privacy Policy Link
.GdprLink__link{
   color: black;
}

For more information:

https://help.landbot.io/article/i2v97a0ylk-header-css-csdes

Background

https://help.landbot.io/article/wqgvzwri85-background-csdes

Messages

https://help.landbot.io/article/pnygcpuhfq-messages-csdes

Blocks

https://help.landbot.io/article/9z11mdfbxo-blocks

Fonts

https://help.landbot.io/article/5j4iox13zz-how-to-use-google-fonts-in-landbot

Widget

https://help.landbot.io/article/nrip1me8pm-customise-design-widget-bubble-livechat-pop-up-embed#overview

Buttons

https://help.landbot.io/article/nk87nbiryj-buttons

Media

https://help.landbot.io/article/qv3jhrbdoq-media

Miscellaneous

https://help.landbot.io/article/7lnn6lhswp-miscellaneous-classes-csdes

How did we do?

Background Class CSS

Contact