diff --git a/client/src/components/vbox.component.jsx b/client/src/components/vbox.component.jsx
index 1f70236c..a3e01b54 100644
--- a/client/src/components/vbox.component.jsx
+++ b/client/src/components/vbox.component.jsx
@@ -213,6 +213,7 @@ class Vbox extends preact.Component {
             const classes = `${v.toLowerCase()} ${selected ? 'highlight' : ''} ${comboHighlight}`;
 
             const vboxObject = shapes[v] ? shapes[v]() : v;
+            const disabled = vbox.bits <= group;
             return (
                 <label draggable='true'
                     onDragStart={ev => {
@@ -223,6 +224,7 @@ class Vbox extends preact.Component {
                     onDragEnd={clearVboxSelected}>
                     <button
                         class={classes}
+                        disabled={disabled}
                         onMouseOver={e => vboxHover(e, v)}
                         onMouseDown={onClick}
                         onClick={e => e.stopPropagation()}
@@ -244,7 +246,7 @@ class Vbox extends preact.Component {
                             onTouchStart={e => e.target.scrollIntoView(true)}
                             onMouseOver={e => hoverInfo(e, 'vbox')}> VBOX
                         </h3>
-                        <div class="bits" onMouseOver={e => hoverInfo(e, 'bits')} >{vbox.bits}b</div>
+                        <div class={`bits ${vbox.bits < 3 ? 'red' : false}`} onMouseOver={e => hoverInfo(e, 'bits')} >{vbox.bits}b</div>
                     </div>
                     <div class="vbox-colours">
                         {range(0, 6).map(i => availableBtn(vbox.free[0][i], 0, i))}