The Color Coded series

Same method, new world every edition. Start anywhere — but the lessons build up book by book, from selectors to full page layouts.

Color Coded Animals edition cover art

Book 1

Animals

10 animal challenges, 10 HTML/CSS lessons

Meet the fox, the panda, the turtle and the penguin. Every page pairs a hand-drawn animal with a tiny stylesheet — read the CSS, find the color, fill it in.

  • Selectors
  • color & background-color
  • Classes & ids
  • Nesting basics

Order the Animals book

Color Coded Space edition cover art

Book 2

Space

Rockets, planets and pixel-perfect night skies

Blast off into gradients, opacity and layering as astronauts, moons and rockets come to life one declaration at a time.

  • Gradients
  • opacity
  • Layering & z-index
  • Custom properties

Coming soon

Color Coded Transportation edition cover art

Book 3

Transportation

Trains, planes and boats built from boxes

Roads, rails and runways make the box model click: margin, padding and border become lanes, stripes and windows.

  • The box model
  • border & radius
  • Widths & heights
  • Simple layout

Coming soon

Color Coded Countries edition cover art

Book 4

Countries

Flags, landmarks and a trip around the globe

Color flags and landmarks from Sweden to Japan while learning how grids and flexbox arrange the world into neat rows and columns.

  • Flexbox
  • Grid rows & columns
  • Reusable classes
  • Alignment

Coming soon