{"id":10722,"date":"2021-08-04T07:29:47","date_gmt":"2021-08-04T07:29:47","guid":{"rendered":"https:\/\/www.rumbletalk.com\/blog\/?post_type=epkb_post_type_1&#038;p=10722"},"modified":"2024-10-21T03:47:44","modified_gmt":"2024-10-21T03:47:44","slug":"chat-design-css-template-starry-night","status":"publish","type":"epkb_post_type_1","link":"https:\/\/rumbletalk.com\/blog\/index.php\/knowledge-base\/chat-design-css-template-starry-night\/","title":{"rendered":"Chat Design CSS Template : Starry Night"},"content":{"rendered":"\n<p>Let us share a chat design with this CSS template that you could use.<\/p>\n\n\n\n<p>To add this on your chat room, go to <em><strong>Design<\/strong><\/em> &gt; <strong><em>Visual Design<\/em><\/strong> &gt; <strong><em>Advance CSS design<\/em><\/strong>.<\/p>\n\n\n\n<p>Then, copy and paste the following.<\/p>\n\n\n\n<p>Add CSS for Web browser: <a href=\"#starry-night-css-web\">starry_night_css_web<\/a><\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img decoding=\"async\" loading=\"lazy\" width=\"800\" height=\"600\" src=\"https:\/\/d241b8qep9dzid.cloudfront.net\/20210714085024\/skinweb.gif\" alt=\"css template\" class=\"wp-image-10742\"\/><\/figure><\/div>\n\n\n<p>Add CSS for Mobile browser: <a href=\"#starry-night-css-mobile\">starry_night_css_mobile<\/a><\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img decoding=\"async\" loading=\"lazy\" width=\"413\" height=\"731\" src=\"https:\/\/d241b8qep9dzid.cloudfront.net\/20210714084310\/skinmobile.gif\" alt=\"\" class=\"wp-image-10741\"\/><\/figure><\/div>\n\n\n<h5 class=\"wp-block-heading starry-night-css-web\">starry_night_css_web<\/h5>\n\n\n\n<pre class=\"wp-block-code\"><code>#text-cover {\n\tbackground-color: #e4e4ef;\n}\n\n#list-frame {\n\twidth: 20%;\n\tbackground-color: #ececec;\n\tborder: 0;\n\tborder-right: 1px solid #d6d6d6;\n}\n\n#list-frame #options {\n\tdisplay: flex;\n\tjustify-content: space-between;\n\tpadding: 0 15px 0;\n\talign-items: center;\n\tbackground-color: #0b3e9a;\n\theight: 44px;\n}\n\n.list-closed #list-frame #options {\n\tpadding: 0 15px 0 5px;\n}\n\n#top-buttons {\n\tborder: 0;\n\tbackground-color: #efefef;\n\tdisplay: flex;\n\tjustify-content: space-between;\n\talign-items: center;\n\tpadding: 2px 15px;\n\theight: auto;\n\tborder-bottom: 1px solid #bbb;\n\tbox-shadow: none;\n}\n\n#invite-button {\n\tdisplay: flex;\n\talign-items: center;\n\tbackground: none;\n\tmax-width: initial;\n\tcolor: #000;\n\tpadding-left: 0;\n\tfont-weight: 700;\n\tfont-size: 13px;\n}\n\n#invite-button:before {\n\tcontent: \"\";\n\tbackground: url(\"https:\/\/d1pfint8izqszg.cloudfront.net\/web7\/images\/chatroom-01-add.svg\") no-repeat;\n\tdisplay: inline-block;\n\theight: 25px;\n\twidth: 25px;\n\tbackground-size: contain;\n\tpadding-right: 8px;\n}\n\n.user-info-selected {\n\tbackground-color: #d0e1ff;\n}\n\ninput:checked+.slider::before {\n\tbackground-color: #0a3e9a;\n}\n\ninput:checked+.slider {\n\tbackground-color: #c0d7ff;\n}\n\n#search-button.invite-enabled {\n\tpadding: 26px 9px 0 15px;\n}\n\n#list {\n\tpadding: 10px 0 0;\n\tbackground-color: #efefef;\n}\n\n#list&gt;div {\n\tpadding: 6px;\n}\n\n#list&gt;div:hover {\n\tbackground-color: #dedede;\n}\n\n#list .user-container {\n\tbackground: none;\n}\n\n.user-container {\n\tpadding: 0 10px;\n\tdisplay: flex;\n\talign-items: center;\n\t-webkit-transition: all ease-in-out .3s;\n\t-moz-transition: all ease-in-out .3s;\n\t-o-transition: all ease-in-out .3s;\n\ttransition: all ease-in-out .3s;\n}\n\n.user-info-selected .user-container {\n\tbackground-color: #78b50d;\n}\n\n.list-closed .user-container {\n\tpadding: 0 10px;\n}\n\n.user-name {\n\tfont-weight: normal;\n\tcolor: #334a08;\n\tfont-size: 13px;\n\ttext-transform: capitalize;\n\tmargin-left: 5px;\n}\n\nbutton#search-button {\n\tcontent: \"\";\n\tbackground: url(\"https:\/\/d1pfint8izqszg.cloudfront.net\/web7\/images\/chatroom-01-search.svg\") no-repeat;\n\tmargin-top: 6px;\n}\n\n#chat-extra&gt;img#smiley, #user-info .private-chat-smiley {\n\tbackground-image: url(\"https:\/\/d1pfint8izqszg.cloudfront.net\/web7\/images\/chatroom-01-emoji.svg\") !important;\n}\n\n#chat-extra&gt;img#upload, #user-info .private-chat-upload {\n\tbackground-image: url(\"https:\/\/d1pfint8izqszg.cloudfront.net\/web7\/images\/chatroom-01-attachment.svg\") !important;\n}\n\n#list-handle {\n\tpadding: 0 !important;\n\tposition: absolute;\n\tright: 48px;\n}\n\n.list-closed #list-handle {\n\tposition: initial;\n}\n\n#list-handle::after {\n\tcontent: \"\";\n\tbackground: url(\"https:\/\/d1pfint8izqszg.cloudfront.net\/web7\/images\/chatroom-01-arrow.svg\") no-repeat;\n\twidth: 16px;\n\theight: 16px;\n\tbackground-size: contain;\n\tdisplay: inline-block;\n}\n\n.list-closed #list {\n\tpadding-top: 15px;\n}\n\n.list-closed #list-handle::after {\n\tcontent: \"\";\n\theight: 22px;\n\tmargin-left: 2px;\n\tbackground: url(\"https:\/\/d1pfint8izqszg.cloudfront.net\/web7\/images\/chatroom-01-arrow-close.svg\") no-repeat !important;\n}\n\n#info {\n\tmargin: 0;\n\tpadding-top: 11px !important;\n\tbackground-color: #efefef;\n\tcolor: #000;\n\tborder: 0;\n}\n\n.list-closed #info {\n\tleft: 50px;\n}\n\n.list-closed #info, .list-closed #list-frame #options {\n\tbackground-color: #ececec;\n\tborder-top: 1px solid #dedede;\n\tcolor: #333;\n}\n\n.list-closed #list-frame #options {\n\theight: 34px;\n}\n\n#listeners {\n\tmargin-left: 10px;\n}\n\n#listeners + span {\n\tmargin-right: 28px;\n}\n\n#listeners + span:last-child {\n\tmargin-right: 0;\n}\n\n.list-closed #listeners + span:last-child {\n\tmargin-right: 10px;\n}\n\n#options a {\n\twidth: 16px !important;\n\theight: 16px !important;\n\tbackground-size: cover !important;\n}\n\n#options #pause {\n\tbackground: url(\"https:\/\/rumbletalk-images-upload.s3.amazonaws.com\/ce97371ee563e4d2078ab5d924788df4\/1588945916-pin-icon.svg\") no-repeat center center;\n\tbackground-position: center !important;\n}\n\n#pause.paused {\n\tbackground: url(\"https:\/\/rumbletalk-images-upload.s3.amazonaws.com\/ce97371ee563e4d2078ab5d924788df4\/1589204097-pin-icon-pause.svg\") no-repeat center center !important;\n}\n\n#options #settings {\n\tbackground: url(\"https:\/\/rumbletalk-images-upload.s3.amazonaws.com\/ce97371ee563e4d2078ab5d924788df4\/1588949251-settings-icon.svg\") no-repeat center center;\n\tbackground-position: center !important;\n}\n\n#options #logout {\n\tbackground: url(\"https:\/\/rumbletalk-images-upload.s3.amazonaws.com\/ce97371ee563e4d2078ab5d924788df4\/1588945971-logout-icon.svg\");\n}\n\n.list-closed #options {\n\twidth: 130px;\n}\n\n.list-closed #options #pause {\n\tbackground: url(\"https:\/\/rumbletalk-images-upload.s3.amazonaws.com\/ce97371ee563e4d2078ab5d924788df4\/1589205041-pin-icon-dark.svg\") no-repeat center center;\n\tbackground-position: center !important;\n}\n\n.list-closed #pause.paused {\n\tbackground: url(\"https:\/\/rumbletalk-images-upload.s3.amazonaws.com\/ce97371ee563e4d2078ab5d924788df4\/1589205015-pin-icon-pause-dark.svg\") no-repeat center center !important;\n}\n\n.list-closed #options #settings {\n\tbackground: url(\"https:\/\/rumbletalk-images-upload.s3.amazonaws.com\/ce97371ee563e4d2078ab5d924788df4\/1589205005-settings-icon-dark.svg\") no-repeat center center;\n\tbackground-position: center !important;\n}\n\n.list-closed #options #logout {\n\tbackground: url(\"https:\/\/rumbletalk-images-upload.s3.amazonaws.com\/ce97371ee563e4d2078ab5d924788df4\/1589205025-logout-icon-dark.svg\");\n}\n\n#chat-frame {\n\twidth: 80%;\n\tbackground-image: url(\"https:\/\/d1pfint8izqszg.cloudfront.net\/web7\/images\/chatroom-01-bg.jpg\");\n\tbackground-size: cover;\n\tmargin: 0;\n}\n\n.list-closed #chat-frame {\n\tpadding-left: 49px;\n}\n\n.user-image {\n\tmargin-right: 0;\n\twidth: 30px;\n\theight: 30px;\n\tborder: 0;\n\tbox-shadow: none;\n\tbackground-color: transparent;\n}\n\n.list-closed .user-image {\n\twidth: 30px;\n\theight: 30px;\n}\n\n.user-info-image {\n\tmax-height: 45px;\n\tmax-width: 45px;\n\tborder: 0;\n}\n\n.guest-default-image {\n\tbackground: url(\"https:\/\/d1pfint8izqszg.cloudfront.net\/web7\/images\/chatroom-01-avatar.svg\");\n}\n\n.plus-minus .buttons button {\n\tborder: 1px solid #c0d7ff;\n}\n\n.plus-minus .buttons button:hover {\n\tbackground-color: #c0d7ff;\n}\n\n#calling-box-options button, #calling-box-answer-buttons button, button.private-export, #login-rumbletalk, .login-button {\n\tbackground-color: #0a3e9a;\n}\n\n#calling-box-options button:hover, #calling-box-answer-buttons button:hover, button.private-export:hover, #login-rumbletalk:hover, .login-button:hover {\n\tbackground-color: #0a3279;\n}\n\n.field, .field:focus {\n\tborder-color: #0a3e9a;\n}\n\n#info {\n\tpadding-top: 8px;\n}\n\n#info span {\n\tfont-size: 11px;\n}\n\n#user-info {\n\tbox-shadow: none;\n}\n\n#user-info, .dialog {\n\tborder: 1px solid #ededed;\n}\n\n#user-info .private-chat-round-button {\n\tbackground: transparent;\n\tbackground-size: contain;\n}\n\n#user-info .private-chat-answer-audio {\n\tbackground-image: url(\"https:\/\/d1pfint8izqszg.cloudfront.net\/web7\/images\/chatroom-01-call.svg\") !important;\n}\n\n#user-info .private-chat-answer-video {\n\tbackground-image: url(\"https:\/\/d1pfint8izqszg.cloudfront.net\/web7\/images\/chatroom-01-video.svg\") !important;\n}\n\n#user-info .private-chat-settings {\n\tbackground-image: url(\"https:\/\/d1pfint8izqszg.cloudfront.net\/web7\/images\/chatroom-01-settings.svg\") !important;\n}\n\n.main-message-container, .system-message-text {\n\tmargin-bottom: 25px;\n}\n\n.message-user-image {\n\tmargin-right: 18px;\n\theight: 40px;\n\twidth: 40px;\n\tbackground-color: transparent;\n\tborder: 0;\n}\n\n.message-user-name {\n\tfont-weight: 600;\n\tcolor: #0a3e9a !important;\n\ttext-transform: capitalize;\n\tfont-size: 15px;\n}\n\n.message-bubble {\n\tborder: 0;\n\tbackground-color: #fff !important;\n\tpadding: 20px;\n\tbox-shadow: 0 1px 5px rgba(0, 0, 0, .1);\n\tborder-radius: 5px;\n}\n\n.message-text.first{\n\tline-height: 23px;\n\tcolor: #2d2d2d;\n\tdisplay: block;\n    margin-top: 10px;\n}\n\n.message-date {\n\tfont-size: 11px;\n\tposition: absolute;\n\tright: 20px;\n\ttop: 8px;\n\tcolor: #b3b2b2;\n}\n\n#text-cover {\n\tbackground-color: #e4e4ef;\n}\n\n#text-input {\n\tbackground: #888;\n\tpadding: 10px 15px 0;\n}\n\n#text-input&#91;contenteditable=\"false\"] {\n\tborder-bottom: 1px solid #d6d6d6;\n}\n\n.list-opened #text-cover::after {\n\tborder: 0;\n}\n\n.list-closed .text-placeholder {\n\tcolor: #824600;\n}\n\n.logged-in .text-placeholder {\n\tcolor: #fff;\n\ttop: 10px;\n}\n\n#chat-extra &gt; img {\n\twidth: 0;\n\theight: 0;\n\tpadding: 11px;\n\tbackground-repeat: no-repeat;\n\tbackground-size: contain;\n}\n\n#chat-extra &gt; img#smiley, #user-info .private-chat-smiley {\n\tbackground-image: url(\"https:\/\/rumbletalk-images-upload.s3.amazonaws.com\/ce97371ee563e4d2078ab5d924788df4\/1589206237-smilie.svg\");\n\tbackground-size: contain;\n}\n\n#chat-extra &gt; img#upload, #user-info .private-chat-upload {\n\tbackground-image: url(\"https:\/\/rumbletalk-images-upload.s3.amazonaws.com\/ce97371ee563e4d2078ab5d924788df4\/1589206215-attach.svg\");\n\tbackground-size: contain;\n}\n\n#chat .message-user-image:hover {\n\tbox-shadow: none;\n}\n\n.list-closed #chat-extra &gt; img#smiley {\n\tbackground-image: url(\"https:\/\/rumbletalk-images-upload.s3.amazonaws.com\/ce97371ee563e4d2078ab5d924788df4\/1589206411-smilie-white.svg\");\n}\n\n.list-closed #chat-extra &gt; img#upload {\n\tbackground-image: url(\"https:\/\/rumbletalk-images-upload.s3.amazonaws.com\/ce97371ee563e4d2078ab5d924788df4\/1589206378-attach-white.svg\");\n}\n\n.dialog {\n\tbox-shadow: 0 0 20px rgba(0, 0, 0, .25);\n\tborder: 0;\n}\n\n.upload-dialog-box &gt; button &gt; img {\n\tbackground-size: contain !important;\n\tbackground-repeat: no-repeat !important;\n\tpadding: 35px;\n\tmargin-bottom: 10px;\n\twidth: 0;\n}\n\n.upload-dialog-box &gt; button:nth-child(1) &gt; img {\n\tbackground: url(\"https:\/\/rumbletalk-images-upload.s3.amazonaws.com\/67de61a5b9cdf1b0ca5b17b306a3b350\/1589900970-upload.svg\");\n}\n\n.upload-dialog-box &gt; button:nth-child(2) &gt; img {\n\tbackground: url(\"https:\/\/rumbletalk-images-upload.s3.amazonaws.com\/67de61a5b9cdf1b0ca5b17b306a3b350\/1589900978-take-photo.svg\");\n}\n\n.upload-dialog-box &gt; button:nth-child(3) &gt; img {\n\tbackground: url(\"https:\/\/rumbletalk-images-upload.s3.amazonaws.com\/67de61a5b9cdf1b0ca5b17b306a3b350\/1589900987-record-audio.svg\");\n}\n\n.upload-dialog-box &gt; button:nth-child(4) &gt; img {\n\tbackground: url(\"https:\/\/rumbletalk-images-upload.s3.amazonaws.com\/67de61a5b9cdf1b0ca5b17b306a3b350\/1589900995-record-video.svg\");\n}\n\n.upload-dialog-box span {\n\tcolor: #222;\n\tfont-size: 13px;\n}\n\n#info span {\n\tfont-size: 11px;\n\ttext-shadow: none;\n}\n\n@media screen and (max-width: 1040px) {\n\t#invite-button {\n\t\tfont-size: 12px;\n\t}\n\t\n\t#search-button.invite-enabled {\n\t\tposition: absolute;\n\t\tright: 5px;\n\t\ttop: 55px;\n\t}\n\t\n\t#list-handle {\n\t\tright: 5px;\n\t}\n}<\/code><\/pre>\n\n\n\n<h5 class=\"wp-block-heading starry-night-css-mobile\">starry_night_css_mobile<\/h5>\n\n\n\n<pre class=\"wp-block-code\"><code>#user-info {\n    background-color: #b5b5b5;\n}\n#user-info .private-chat-round-button {\n    background: no-repeat 6px 6px #0a3e9a;\n}\n.private-chat-username {\n    color: #000;\n}\ndiv#top-bar-left span:before {\n    content: \"\";\n    background: url(https:\/\/d1pfint8izqszg.cloudfront.net\/web7\/images\/chatroom-01-add.svg) no-repeat;\n    display: inline-block;\n    height: 25px;\n    width: 25px;\n    background-size: contain;\n    padding-right: 8px;\n}\ndiv#top-bar-left span {\n    display: flex;\n    align-items: center;\n    padding-left: 10px;\n    color: #000;\n}\nimg.invite-icon {\n    display: none;\n}\n#calling-box-options button, #calling-box-answer-buttons button, button.private-export, #login-rumbletalk, .login-button{\n    background-color: #0a3e9a;\n}\n.top-bar {\n    background-color: #efefef;\n}\n#top-bar-right, #top-bar-left {\n    background-color: transparent;\n}\n#top-bar-right img {\n    display: none;\n}\ndiv#chat {\n    background-image: url(https:\/\/d1pfint8izqszg.cloudfront.net\/web7\/images\/chatroom-01-bg.jpg);\n    background-size: cover;\n    padding: 20px 7px;\n}\ndiv#top-bar-right:after {\n    content: \"\";\n    background: url(https:\/\/d1pfint8izqszg.cloudfront.net\/web7\/images\/chatroom-01-mobile-menu.svg) no-repeat;\n    display: inline-block;\n    height: 25px;\n    width: 25px;\n    background-size: contain;\n}\n.guest-default-image {\n\tbackground: url(\"https:\/\/d1pfint8izqszg.cloudfront.net\/web7\/images\/chatroom-01-avatar.svg\");\n}\n.message-user-image {\n    border: 0;\n}\ndiv#bottom button {\n    background: transparent;\n}\n#bottom {\n    background-color: #0a3e9a;\n}\ninput:checked+.slider {\n    background-color: #c0d7ff;\n}\ninput:checked+.slider::before {\n    background-color: #0a3e9a;\n}\n.plus-minus .buttons button {\n    border: 1px solid #c0d7ff;\n}\n#invite-dialog {\n    background-color: #d4d4d4;\n}\n#invite-dialog.active+#top-bar-left {\n    background-color: #d4d4d4;\n}\ndiv#list {\n    background-color: #d4d4d4;\n    color: #000;\n}\n.dialog-content {\n    top: 30%;\n    left: 50%;\n    transform: translateX(-50%);\n    position: absolute;\n}\n.dialog-content.take-photo-dialog, .dialog-content.take-photo-dialog, .dialog-content.options-dialog {\n    top: initial;\n    left: initial;\n    transform: initial;\n    position: initial;\n}\n.canvas-holder canvas {\n    top: 17%;\n    left: 10%;\n    position: absolute;\n}<\/code><\/pre>\n","protected":false},"excerpt":{"rendered":"<p>Chat Design CSS Template : Starry Night &#8211; online group chat for website<\/p>\n","protected":false},"author":17,"featured_media":0,"comment_status":"closed","ping_status":"closed","template":"","meta":[],"epkb_post_type_1_category":[340],"epkb_post_type_1_tag":[],"acf":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v20.10 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>Chat Design CSS Template : Starry Night - Online Group Chat Room Plugin for Websites and Live events<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/rumbletalk.com\/blog\/index.php\/knowledge-base\/chat-design-css-template-starry-night\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Chat Design CSS Template : Starry Night - Online Group Chat Room Plugin for Websites and Live events\" \/>\n<meta property=\"og:description\" content=\"Chat Design CSS Template : Starry Night - online group chat for website\" \/>\n<meta property=\"og:url\" content=\"https:\/\/rumbletalk.com\/blog\/index.php\/knowledge-base\/chat-design-css-template-starry-night\/\" \/>\n<meta property=\"og:site_name\" content=\"Online Group Chat Room Plugin for Websites and Live events\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/rumbletalk\" \/>\n<meta property=\"article:modified_time\" content=\"2024-10-21T03:47:44+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/rumbletalk.com\/blog\/wp-content\/uploads\/2021\/07\/skinweb.gif\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:site\" content=\"@rumbletalk\" \/>\n<meta name=\"twitter:label1\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data1\" content=\"1 minute\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/rumbletalk.com\/blog\/index.php\/knowledge-base\/chat-design-css-template-starry-night\/\",\"url\":\"https:\/\/rumbletalk.com\/blog\/index.php\/knowledge-base\/chat-design-css-template-starry-night\/\",\"name\":\"Chat Design CSS Template : Starry Night - Online Group Chat Room Plugin for Websites and Live events\",\"isPartOf\":{\"@id\":\"https:\/\/rumbletalk.com\/blog\/#website\"},\"datePublished\":\"2021-08-04T07:29:47+00:00\",\"dateModified\":\"2024-10-21T03:47:44+00:00\",\"breadcrumb\":{\"@id\":\"https:\/\/rumbletalk.com\/blog\/index.php\/knowledge-base\/chat-design-css-template-starry-night\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/rumbletalk.com\/blog\/index.php\/knowledge-base\/chat-design-css-template-starry-night\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/rumbletalk.com\/blog\/index.php\/knowledge-base\/chat-design-css-template-starry-night\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/rumbletalk.com\/blog\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Chat Design CSS Template : Starry Night\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/rumbletalk.com\/blog\/#website\",\"url\":\"https:\/\/rumbletalk.com\/blog\/\",\"name\":\"Online Group Chat Plugin for Websites and Event\",\"description\":\"Embed a social group chat for communities and events. Grow your online audience with the next evolution of HTML chat room. Attach files, Mobile, Audio and Video calls.\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/rumbletalk.com\/blog\/?s={search_term_string}\"},\"query-input\":\"required name=search_term_string\"}],\"inLanguage\":\"en-US\"},{\"@type\":\"Person\",\"@id\":\"https:\/\/rumbletalk.com\/blog\/#\/schema\/person\/53a763b494aec8f004846c17ae8d90c3\",\"name\":\"Mary Alice\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/rumbletalk.com\/blog\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/96b1fbff01b496d6a7d82bba8a4738f7?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/96b1fbff01b496d6a7d82bba8a4738f7?s=96&d=mm&r=g\",\"caption\":\"Mary Alice\"},\"url\":\"https:\/\/rumbletalk.com\/blog\/index.php\/author\/mary-alice\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Chat Design CSS Template : Starry Night - Online Group Chat Room Plugin for Websites and Live events","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/rumbletalk.com\/blog\/index.php\/knowledge-base\/chat-design-css-template-starry-night\/","og_locale":"en_US","og_type":"article","og_title":"Chat Design CSS Template : Starry Night - Online Group Chat Room Plugin for Websites and Live events","og_description":"Chat Design CSS Template : Starry Night - online group chat for website","og_url":"https:\/\/rumbletalk.com\/blog\/index.php\/knowledge-base\/chat-design-css-template-starry-night\/","og_site_name":"Online Group Chat Room Plugin for Websites and Live events","article_publisher":"https:\/\/www.facebook.com\/rumbletalk","article_modified_time":"2024-10-21T03:47:44+00:00","og_image":[{"url":"https:\/\/rumbletalk.com\/blog\/wp-content\/uploads\/2021\/07\/skinweb.gif"}],"twitter_card":"summary_large_image","twitter_site":"@rumbletalk","twitter_misc":{"Est. reading time":"1 minute"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/rumbletalk.com\/blog\/index.php\/knowledge-base\/chat-design-css-template-starry-night\/","url":"https:\/\/rumbletalk.com\/blog\/index.php\/knowledge-base\/chat-design-css-template-starry-night\/","name":"Chat Design CSS Template : Starry Night - Online Group Chat Room Plugin for Websites and Live events","isPartOf":{"@id":"https:\/\/rumbletalk.com\/blog\/#website"},"datePublished":"2021-08-04T07:29:47+00:00","dateModified":"2024-10-21T03:47:44+00:00","breadcrumb":{"@id":"https:\/\/rumbletalk.com\/blog\/index.php\/knowledge-base\/chat-design-css-template-starry-night\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/rumbletalk.com\/blog\/index.php\/knowledge-base\/chat-design-css-template-starry-night\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/rumbletalk.com\/blog\/index.php\/knowledge-base\/chat-design-css-template-starry-night\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/rumbletalk.com\/blog\/"},{"@type":"ListItem","position":2,"name":"Chat Design CSS Template : Starry Night"}]},{"@type":"WebSite","@id":"https:\/\/rumbletalk.com\/blog\/#website","url":"https:\/\/rumbletalk.com\/blog\/","name":"Online Group Chat Plugin for Websites and Event","description":"Embed a social group chat for communities and events. Grow your online audience with the next evolution of HTML chat room. Attach files, Mobile, Audio and Video calls.","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/rumbletalk.com\/blog\/?s={search_term_string}"},"query-input":"required name=search_term_string"}],"inLanguage":"en-US"},{"@type":"Person","@id":"https:\/\/rumbletalk.com\/blog\/#\/schema\/person\/53a763b494aec8f004846c17ae8d90c3","name":"Mary Alice","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/rumbletalk.com\/blog\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/96b1fbff01b496d6a7d82bba8a4738f7?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/96b1fbff01b496d6a7d82bba8a4738f7?s=96&d=mm&r=g","caption":"Mary Alice"},"url":"https:\/\/rumbletalk.com\/blog\/index.php\/author\/mary-alice\/"}]}},"_links":{"self":[{"href":"https:\/\/rumbletalk.com\/blog\/index.php\/wp-json\/wp\/v2\/epkb_post_type_1\/10722"}],"collection":[{"href":"https:\/\/rumbletalk.com\/blog\/index.php\/wp-json\/wp\/v2\/epkb_post_type_1"}],"about":[{"href":"https:\/\/rumbletalk.com\/blog\/index.php\/wp-json\/wp\/v2\/types\/epkb_post_type_1"}],"author":[{"embeddable":true,"href":"https:\/\/rumbletalk.com\/blog\/index.php\/wp-json\/wp\/v2\/users\/17"}],"replies":[{"embeddable":true,"href":"https:\/\/rumbletalk.com\/blog\/index.php\/wp-json\/wp\/v2\/comments?post=10722"}],"version-history":[{"count":15,"href":"https:\/\/rumbletalk.com\/blog\/index.php\/wp-json\/wp\/v2\/epkb_post_type_1\/10722\/revisions"}],"predecessor-version":[{"id":17257,"href":"https:\/\/rumbletalk.com\/blog\/index.php\/wp-json\/wp\/v2\/epkb_post_type_1\/10722\/revisions\/17257"}],"wp:attachment":[{"href":"https:\/\/rumbletalk.com\/blog\/index.php\/wp-json\/wp\/v2\/media?parent=10722"}],"wp:term":[{"taxonomy":"epkb_post_type_1_category","embeddable":true,"href":"https:\/\/rumbletalk.com\/blog\/index.php\/wp-json\/wp\/v2\/epkb_post_type_1_category?post=10722"},{"taxonomy":"epkb_post_type_1_tag","embeddable":true,"href":"https:\/\/rumbletalk.com\/blog\/index.php\/wp-json\/wp\/v2\/epkb_post_type_1_tag?post=10722"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}