<div class="circle position-absolute"></div>

<h3>Group Chat demo</h3> 
<p>Adding to group after auth</p>
<script src="https://api.imbachat.com/imbachat/v1/6470/widget"></script>
.main-phone {
  background: url(https://imbachat.com/themes/imbachat/assets/img/main-phone.svg)
  width: 380px;
  height: 700px;
  float: right;
  margin-top: -25px;
.position-absolute {
  position: absolute !important;
.circle {
  width: 2000px;
  height: 2000px;
  top: -1200px;
  right: 50px;
  z-index: -1;
  border-radius: 50%;
  background: linear-gradient(183.15deg, #b2dfff 63.89%, #549cff 97.24%);

  display: none !important;

#imbachat .roomvideochat #imbaSynergyChat-theme .chat_body .room_area{
  max-width: 100% !important;

  window.imbaApi.on('ImbaChat.Auth.Success', () => {
    //unique name of group
    let pipe = "GR_chat";
    //Title of group
    let title = "Group chat for all"
      pipe: pipe,
      title: title,
      is_public: 1,
      type: imbaApi.room_type.conference,

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.