JSFiddle - React, Tailwind, and code Playground

by Taufik Nurrohman

HTML

<div></div>

CSS

/* 
 * Pure CSS3 Chessboard only with One Element by Taufik Nurrohman 
 * Date:  31 January 2012 
 * Visit: http://hompimpaalaihumgambreng.blogspot.com 
 * Note:  This work is under a Creative Commons license (Attribution)(Non commercial)(No Derivate Works) 
 */ 
 
* {margin:0px 0px;padding:0px 0px;} 
 
body {background:#ccc;} 
 
div { 
  position:relative; 
  width:50px; 
  height:50px; 
  background:black; 
  margin:30px 0px 450px 30px; 
  -webkit-box-shadow: 
    50px 0px white, 100px 0px 0px black, 
    150px 0px 0px white, 200px 0px 0px black, 
    250px 0px 0px white, 300px 0px 0px black, 350px 0px 0px white, 
 
    0px 50px 0px white, 50px 50px 0px black, 
    100px 50px 0px white, 150px 50px 0px black, 
    200px 50px 0px white, 250px 50px 0px black, 
    300px 50px 0px white, 350px 50px 0px black, 
 
    0px 100px 0px black, 50px 100px 0px white, 
    100px 100px 0px black, 150px 100px 0px white, 
    200px 100px 0px black, 250px 100px 0px white, 
    300px 100px 0px black, 350px 100px 0px white, 
 
    0px 150px 0px white, 50px 150px 0px black, 
    100px 150px 0px white, 150px 150px 0px black, 
    200px 150px 0px white, 250px 150px 0px black, 
    300px 150px 0px white, 350px 150px 0px black, 
 
    0px 200px 0px black, 50px 200px 0px white, 
    100px 200px 0px black, 150px 200px 0px white, 
    200px 200px 0px black, 250px 200px 0px white, 
    300px 200px 0px black, 350px 200px 0px white, 
 
    0px 250px 0px white, 50px 250px 0px black, 
    100px 250px 0px white, 150px 250px 0px black, 
    200px 250px 0px white, 250px 250px 0px black, 
    300px 250px 0px white, 350px 250px 0px black, 
 
    0px 300px 0px black, 50px 300px 0px white, 
    100px 300px 0px black, 150px 300px 0px white, 
    200px 300px 0px black, 250px 300px 0px white, 
    300px 300px 0px black, 350px 300px 0px white, 
 
    0px 350px 0px white, 50px 350px 0px black, 
    100px 350px 0px white, 150px 350px 0px black, 
    200px 350px 0px white, 250px 350px 0px black, 
    300px...

JavaScript

// How to Make a Chess Board with just One Element