FEN

Typing

type FEN = string;

What is it FEN?

FEN notation is a compact way to represent the state of a chessboard.
You can read about FEN notation on this page 👈

If a FEN value is invalid, the chessboard falls back to the default position. See common FEN errors for troubleshooting.

The board size is detected from the FEN piece placement. A number in FEN means the number of empty squares in a row, so 12 means twelve empty squares. The component renders the required number of cells from the passed FEN string.

Example

<ChessBoard 
    FEN="3k4/qqqqqqqq/8/8/8/8/QQQQQQQQ/3K4 w - - 0 1" // <~~~ Custom FEN
    onChange={handleChange}
    onEndGame={handleEndGame}
/>

Custom board size

<ChessBoard
    FEN="qqrnbqkbnrqq/pppppppppppp/12/12/12/12/12/12/12/12/PPPPPPPPPPPP/QQRNBQKBNRQQ w - - 0 1"
    onChange={console.log}
    onEndGame={console.log}
/>