Resources

Style Tiles

OtherSprout

Samantha Warren's deliverable for the gap between a moodboard and a comp — one sheet of fonts, colors and interface elements that says what a site will feel like before a single page is designed — with the free template and the four-step process (listen, interpret, define, iterate) that goes with it.

Web

The site's own line is the whole idea: style tiles are for when a moodboard is too vague and a comp is too literal. A tile is a single board — headline and body type, a palette, a button, a link, a texture or two, three adjectives — that a client can react to as feel without arguing about a layout that does not exist yet. Iterate the tile, agree on it, then design pages inside it.

Thirteen years on it reads as the ancestor of a design-token sheet: the same decisions — type, color, the shape of a control — made once, before any component, and carried into everything after. The process is the part to keep; the PSD template is of its era, and a tile today is a Figma frame or, here, a theme file. The glossary has the term.

  • a: Appearance
  • ?: Keyboard shortcuts