Member-only story
Where does the checkerboard transparency grid come from?
Solar cells, photoshop and cuttlefish
I love colours. But, I’m terrible at choosing them.
While writing an article on “What colour should your Figma boards be?” I switched off all colours on the background of my Figma board and noticed the classic checkerboard background.

This left me with two questions:
Why is the checkerboard pattern so ubiquitous in editors? and when did it become a standard?
What is the Transparency Grid?
In case you’re unsure, when I say transparency grid, we’re talking about this pattern below.



You’ve probably seen them when downloading a .PNG image that you thought was an SVG image or more likely when opening up a blank Figma/Photoshop editor.
I knew it as that checkerboard thingy. But Photoshop and Figma, have a fancy name called the Transparency Grid.