Other Bootstrap 5Free+ CSS
Experience seamless collaboration with live typing indicators and presence dots in a stunning ocean-inspired UI.
1 views0 downloads
gosnippets.com/preview/ocean-depth-real-time-collaboration-interface
Loading…
Experience seamless collaboration with live typing indicators and presence dots in a stunning ocean-inspired UI.
1
2<section class="gs-stage">
3 <div class="gs-orb gs-orb-1" aria-hidden="true"></div>
4 <div class="gs-orb gs-orb-2" aria-hidden="true"></div>
5 <div class="gs-grid-overlay" aria-hidden="true"></div>
6 <div class="gs-card">
7 <div class="gs-card-inner">
8 <h1 class="gs-title">Live Collaboration</h1>
9 <div class="gs-participants">
10 <div class="gs-participant">
11 <svg class="gs-icon" width="16" height="16">
12 <circle></circle>
13 </svg>
14 <span class="gs-name">Alex</span>
15 </div>
16 <div class="gs-participant">
17 <svg class="gs-icon" width="16" height="16">
18 <circle></circle>
19 </svg>
20 <span class="gs-name">Jamie</span>
21 </div>
22 </div>
23 <div class="gs-typing-indicator">
24 <span class="gs-dot"></span>
25 <span class="gs-dot"></span>
26 <span class="gs-dot"></span>
27 </div>
28 </div>
29 </div>
30</section>
Comments(0)
No comments yet — be the first to start the discussion.
Sign in to join the conversation.