Brand. The stateofpixel logo, colors and type. Download what you need.

stateofpixel mark
Marksvgpng
stateofpixel mark, inverse
Mark, inversesvgpng
stateofpixel wordmark
Wordmarksvgpng
stateofpixel wordmark, inverse
Wordmark, inversesvgpng

Usage. A few rules keep the logo readable wherever it shows up.

  • Write the name in lowercase.stateofpixel, one word, also at the start of a sentence.
  • Match the background.Use the ink logo on light backgrounds and the inverse logo on dark ones.
  • Leave the logo as it is.Don't recolor, rotate, stretch or outline it, and don't add shadows.
  • Give it room.Keep clear space of at least a quarter of the mark's width on every side.

Colors. The logo uses ink and paper only. Color in the product is kept for status and the diff highlight.

  • Ink

    #171717

    Tile on light backgrounds, text

  • Paper

    #fafafa

    Pixels on the ink tile, page

  • Ink on dark

    #ededed

    Tile on dark backgrounds

  • Black

    #000000

    Pixels on the inverse tile

Type. Two open source families, one sans and one mono.

  • IBM Plex SansInterface, headings and the wordmark, in SemiBold. Source
  • LilexCode, hashes and numbers in tables. Source