Skip to main content
CSS-Tricks
  • Articles
  • Notes
  • Links
  • Guides
  • Almanac
  • Picks
  • Shuffle
Search

Articles Tagged
CSS games

1 Articles
{
,

}
Scattered tangram puzzle.
Direct link to the article Breaking Boundaries: Building a Tangram Puzzle With (S)CSS
CSS games Sass

Breaking Boundaries: Building a Tangram Puzzle With (S)CSS

We put it to the test and it turns out Sass can replace JavaScript, at least when it comes to low-level logic and puzzle behavior. With nothing but maps, mixins, functions, and a whole lot of math, we managed to bring our Tangram puzzle to life, no JavaScript required.
Sladjana Stojanovic on Jun 12, 2025

TOC

  1. The game
  2. The HTML structure
  3. Creating maps for shape data
  4. Using mixins to read from maps
  5. Start logic

CSS-Tricks is powered by DigitalOcean.

Keep up to date on web dev

with our hand-crafted newsletter

DigitalOcean
  • About DO
  • Cloudways
  • Legal stuff
  • Get free credit!
CSS-Tricks
  • Contact
  • Write for CSS-Tricks!
  • Advertise with us
Social
  • RSS Feeds
  • CodePen
  • Mastodon
  • Bluesky
Back to Top