Clear Board

Use the clear method to remove all the pieces from the board.

HTML

<chess-board
    style="width: 400px"
    position="start"
    draggable-pieces>
</chess-board>

<button id="clearBoardBtn">Clear Board</button>
<button id="startPositionBtn">Start Position</button>
<button id="clearBoardInstantBtn">Clear Board Instant</button>

JavaScript

const board = document.querySelector('chess-board');

document.querySelector('#clearBoardBtn').addEventListener('click', () => {
  board.clear();
});

document.querySelector('#startPositionBtn').addEventListener('click', () => {
  board.start();
});

document.querySelector('#clearBoardInstantBtn').addEventListener('click', () => {
  board.clear(false);
});