input { display:none; } label { display:inline-block; width:10px; height:10px; border:1px solid #ccc; position:relative; } input:checked+label { border-color:#888; } input:checked+label:before { content:''; display:inline-block; width:2px; height:6px; background:#000; transform:rotate(-30deg); position:absolute; top:4px; left:0; } input:checked+label:after { content:''; display:inline-block; width:2px; height:10px; background:#000; transform:rotate(30deg); position:absolute; top:1px; left:3px; }