# UiKIT\<\> UI KIT

**URL:** <https://community.sendbird.com/t/uikit-ui-kit/321>\
**Category:** Sendbird Chat API/SDK\
**Tags:** uikit\
**Created:** [May 27, 2020, 5:33am UTC](https://community.sendbird.com/t/uikit-ui-kit/321 "2020-05-27T05:33:15Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![Nush](https://sea2.discourse-cdn.com/flex020/user_avatar/community.sendbird.com/nush/32/68_2.png) [@Nush](https://community.sendbird.com/u/Nush)\
**Post date:** [May 27, 2020, 5:33am UTC](https://community.sendbird.com/t/uikit-ui-kit/321/1 "2020-05-27T05:33:15Z")

</div>

Hi, Friends,

I was wondering if anyone here has experience creating a list view of the user and “chat pop up window” using the SendBird UI kit. I was asked this and below is the inquiry I received.

Thanks in advance!

Hello Nush,

Thanks for sharing the document. We are looking for design exactly like Facebook. Do we have a UI kit for the list view of the user and chat popup window.

for example

> **[Screenshot](https://prnt.sc/sluzaq)**
>
> Captured with Lightshot

We are looking to integrate into the website and Apps.

–

---

<div class="post-metadata">

**Author:** ![Sravan\_S](https://sea2.discourse-cdn.com/flex020/user_avatar/community.sendbird.com/sravan_s/32/83_2.png) [@Sravan\_S](https://community.sendbird.com/u/Sravan_S)\
**Post date:** [May 27, 2020, 7:09am UTC](https://community.sendbird.com/t/uikit-ui-kit/321/2 "2020-05-27T07:09:39Z")

</div>

Hello

This is theoretically possible, but, you have to manage channelUrls in your app. I will try to create a sample and get back to you

---

<div class="post-metadata">

**Author:** ![Nush](https://sea2.discourse-cdn.com/flex020/user_avatar/community.sendbird.com/nush/32/68_2.png) [@Nush](https://community.sendbird.com/u/Nush)\
**Post date:** [May 27, 2020, 7:13am UTC](https://community.sendbird.com/t/uikit-ui-kit/321/3 "2020-05-27T07:13:02Z")

</div>

Thank you SOOO much @Sravan_S!!!

---

<div class="post-metadata">

**Author:** ![Sravan\_S](https://sea2.discourse-cdn.com/flex020/user_avatar/community.sendbird.com/sravan_s/32/83_2.png) [@Sravan\_S](https://community.sendbird.com/u/Sravan_S)\
**Post date:** [May 28, 2020, 2:11am UTC](https://community.sendbird.com/t/uikit-ui-kit/321/4 "2020-05-28T02:11:36Z")

</div>

So, can you try [https://codesandbox.io/s/intelligent-brahmagupta-rpkx2](https://codesandbox.io/s/intelligent-brahmagupta-rpkx2)

Steps:

- Add appId and userId in `/src/Chat/Index.jsx`
- Hover on chat icon
- Click on an avatar to start chat

 ![Kapture 2020-05-28 at 11.09.20](https://us1.discourse-cdn.com/flex020/uploads/sendbird/original/1X/7de3678355d61989beeb77eee754152d2ff7c21a.gif)

---

<div class="post-metadata">

**Author:** ![Nush](https://sea2.discourse-cdn.com/flex020/user_avatar/community.sendbird.com/nush/32/68_2.png) [@Nush](https://community.sendbird.com/u/Nush)\
**Post date:** [May 28, 2020, 2:26am UTC](https://community.sendbird.com/t/uikit-ui-kit/321/5 "2020-05-28T02:26:58Z")

</div>

@Sravan_S Awesome! many thanks! sending it now to the customer for their feedback 🙂