JSFiddle - React, Tailwind, and code Playground

HTML

<table class="collapse">
                    <thead>
                        <tr>
                            <th><label>Labels</label></th>
                            <th><label>Labels</label></th>
                            <th><label>Labels</label></th>
                            <th><label>Labels</label></th>
                            <th><label>Labels</label></th>
                        </tr>
                    </thead>
                    
                    <tbody>
                        <tr>
                            <td><label>Value</label></td>
                            <td><label>Value</label></td>
                            <td><label>Value</label></td>
                            <td><label>Value</label></td>
                            <td><label>Value</label></td>                            
                        </tr>
                    </tbody>                    
                </table>


<table>
                    <thead>
                        <tr>
                            <th><label>Labels</label></th>
                            <th><label>Labels</label></th>
                            <th><label>Labels</label></th>
                            <th><label>Labels</label></th>
                            <th><label>Labels</label></th>
                        </tr>
                    </thead>
                    
                    <tbody>
                        <tr>
                            <td><label>Value</label></td>
                            <td><label>Value</label></td>
                            <td><label>Value</label></td>
                            <td><label>Value</label></td>
                            <td><label>Value</label></td>                            
                        </tr>
                    </tbody>                    
                </table>

CSS

.collapse{
    border-collapse: collapse;
    /*border-spacing: 0;*/
}

table {
    width: 600px;
    margin: 30px;
    border: 1px solid #222;
    border-radius: 26px;
    -moz-border-radius: 26px;
    -webkit-border-radius: 26px;
}        
th:first-child {
    border-radius: 46px 0 0 0;
    -moz-border-radius: 46px 0 0 0;
    -webkit-border-radius: 46px 0 0 0;
}

 th:last-child {
    border-radius: 0 6px 0 0;
    -moz-border-radius: 0 6px 0 0;
    -webkit-border-radius: 0 6px 0 0;
}

td:first-child, th:first-child {
    border-left: medium none;
}

th {
    background-image: -moz-linear-gradient(center top , rgba(240,200,240,0.8), rgba(200,240,240,0.6));
    background-image: -webkit-gradient(linear, 0 0, 0 bottom, from(rgba(240,200,240,0.8)), to(rgba(200,240,240,0.6)), color-stop(.4, rgba(240,200,240,0.8)));
    border-top: medium none;
}

td, th {
    border-left: 1px solid #CCCCCC;
    border-top: 1px solid #CCCCCC;
    padding: 10px;
    text-align: left;
}