Chess Game
SEO boost via higher time-on-site
About this component
Update 1.1
Added castling (rochade) support.
About
Chess Game adds a fully playable chess board with an integrated AI opponent to your Framer projects. Drop it into a hero, a 404 page or a “Play” section and let visitors challenge the computer directly on your site. Choose your side (white or black), pick from three difficulty levels and enjoy a responsive board that scales with any layout.
What it does
Renders an 8×8 chess board, handles turns between the player and the AI, generates legal moves and highlights the selected piece plus all valid target squares. The component shows status text for whose turn it is and game states like check, checkmate or stalemate, and includes a reset button so visitors can instantly start a new game.
What you can customize
Game settings: Play as White or Black, default difficulty (Easy / Normal / Hard), status bar show/hide, reset button show/hide.
Board & pieces: Light and dark square colors, white and black piece colors, check highlight color, size of the pieces customizable.
Status & button: Status text color and font, reset button color, label text color and font – so the game can match any brand or page style.
Great for
404 / empty states
launch & product pages
event or tournament pages
dashboards and profile/portfolio pages
“just for fun” sections on any site
Share your build
If you ship something cool with it, post it on X and tag me @Matthias_Oel, or send it over. I’d love to see what you create.
Need help?
Questions or feedback? Reach me anytime: matthias@lmvision.de or on X @Matthias_Oel.
