Patterns — Cloud Mist Labs

Patterns.

Six ground patterns. All stretch-to-fit. All read from a single foreground/background token pair so they shift cleanly between light and dark surfaces.

Pattern specimens

  • 01 · Stratum repeat

    The mark, tiled. Field-fill for hero blocks, deck covers.

  • 02 · Pill grid

    Varied-width pills, rhythmic. Background for testimonials, decks.

  • 03 · Horizons

    Three soft horizontal bands. The brand-anchor pattern. Most-used.

  • 04 · Strata wave

    Three layered sine waves. Hero accents only — never as full ground.

  • 05 · Blueprint

    Dashed grid + dots. Technical pages, decks, internal docs.

  • 06 · Punch card

    Mono lines at decreasing opacity. Status pages, system docs.

Rules.

When to use a pattern, when not to.

Do
  • Use one pattern per surface, never two.
  • Read foreground from --ink or --signal only.
  • Read background from --paper or --paper-soft only.
  • Pair with a calm headline. The pattern is the field; the words are the figure.
Don’t
  • Stack patterns over photos.
  • Animate at scroll — they’re ground, not motion.
  • Use full opacity on hero text backgrounds.
  • Recolour with hex; everything reads from tokens.