<section class="section py-24 has-background-light-light">
<div class="container">
<div class="has-mw-6xl mx-auto">
<div class="px-4 px-10-tablet py-12 has-background-white" style="box-shadow: 0px 48px 86px rgb(0 0 0 / 5%) !important">
<div class="pb-4" style="overflow-x: scroll;">
<table class="table is-striped is-fullwidth">
<thead>
<tr><th scope="col"></th><th scope="col"><small class="has-text-weight-normal">Feature 1</small></th><th scope="col"><small class="has-text-weight-normal">Feature 2</small></th><th scope="col"><small class="has-text-weight-normal">Feature 3</small></th><th scope="col"><small class="has-text-weight-normal">Feature 4</small></th><th scope="col"><small class="has-text-weight-normal">Feature 5</small></th></tr>
</thead>
<tbody>
<tr>
<th scope="row"><small class="has-text-weight-normal">Number of Team Members</small></th>
<td><small>5</small></td>
<td><small>20</small></td>
<td><small>200+</small></td>
<td><small>Unlimited</small></td>
<td><small>Unlimited</small></td>
</tr>
<tr>
<th scope="row"><small class="has-text-weight-normal">Users</small></th>
<td><small>10</small></td>
<td><small>45</small></td>
<td><small>500+</small></td>
<td><small>100+</small></td>
<td><small>Unlimited</small></td>
</tr>
<tr>
<th scope="row"><small class="has-text-weight-normal">Projects</small></th>
<td><small>10</small></td>
<td><small>45</small></td>
<td><small>25/mo</small></td>
<td><small>Unlimited</small></td>
<td><small>Unlimited</small></td>
</tr>
<tr>
<th scope="row"><small class="has-text-weight-normal">Video Chat</small></th>
<td>
<svg width="12" height="9" viewbox="0 0 12 9" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M11.0001 1L4.00004 8.00002L1 5" stroke="#CFBDFF" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path>
</svg>
</td>
<td>
<svg width="12" height="9" viewbox="0 0 12 9" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M11.0001 1L4.00004 8.00002L1 5" stroke="#CFBDFF" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path>
</svg>
</td>
<td>
<svg width="12" height="9" viewbox="0 0 12 9" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M11.0001 1L4.00004 8.00002L1 5" stroke="#CFBDFF" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path>
</svg>
</td>
<td>
<svg width="12" height="9" viewbox="0 0 12 9" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M11.0001 1L4.00004 8.00002L1 5" stroke="#CFBDFF" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path>
</svg>
</td>
<td>
<svg width="12" height="9" viewbox="0 0 12 9" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M11.0001 1L4.00004 8.00002L1 5" stroke="#CFBDFF" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path>
</svg>
</td>
</tr>
<tr>
<th scope="row"><small class="has-text-weight-normal">Real-Time Collaboration</small></th>
<td>
<svg width="12" height="2" viewbox="0 0 12 2" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M1 1L11 1" stroke="#CFBDFF" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path>
</svg>
</td>
<td>
<svg width="12" height="2" viewbox="0 0 12 2" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M1 1L11 1" stroke="#CFBDFF" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path>
</svg>
</td>
<td>
<svg width="12" height="9" viewbox="0 0 12 9" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M11.0001 1L4.00004 8.00002L1 5" stroke="#CFBDFF" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path>
</svg>
</td>
<td>
<svg width="12" height="9" viewbox="0 0 12 9" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M11.0001 1L4.00004 8.00002L1 5" stroke="#CFBDFF" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path>
</svg>
</td>
<td>
<svg width="12" height="9" viewbox="0 0 12 9" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M11.0001 1L4.00004 8.00002L1 5" stroke="#CFBDFF" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path>
</svg>
</td>
</tr>
<tr>
<th scope="row"><small class="has-text-weight-normal">Support</small></th>
<td>
<svg width="12" height="2" viewbox="0 0 12 2" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M1 1L11 1" stroke="#CFBDFF" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path>
</svg>
</td>
<td>
<svg width="12" height="2" viewbox="0 0 12 2" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M1 1L11 1" stroke="#CFBDFF" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path>
</svg>
</td>
<td>
<svg width="12" height="2" viewbox="0 0 12 2" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M1 1L11 1" stroke="#CFBDFF" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path>
</svg>
</td>
<td>
<svg width="12" height="9" viewbox="0 0 12 9" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M11.0001 1L4.00004 8.00002L1 5" stroke="#CFBDFF" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path>
</svg>
</td>
<td>
<svg width="12" height="9" viewbox="0 0 12 9" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M11.0001 1L4.00004 8.00002L1 5" stroke="#CFBDFF" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path>
</svg>
</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
</section>Framework
All Frameworks
UI Library
Pstls.
Pstls UI Components by Shuffle
Choose from 447 of ready-made UI components available in Shuffle Editor.
By subscribing to the editor, you get access to all of them.
The UI libraries are available in four frameworks - Tailwind CSS, Bootstrap, Bulma, and Material-UI (React). We divided them into components, under which there is clear code. In Shuffle Editor, you can build whole templates from them, editing styles, texts, images, and other features. You can also export them as code and work in your favorite IDE.
