Set System

Brand

The Monospaced visual identity.

The Monospaced wordmark in white monospaced type beside the checkered pixel logomark, on a brand cyan field
Logo
Logo construction
The logomark alone: a narrow vertical checkerboard of white pixel cells centered on a brand cyan field
Logomark
Logomark animation
Type specimen of Berkeley Mono on near-black, showing 'Hamburgefonstiv' and the digits zero to nine
Typeface
A sample sentence set in light monospaced type on near-black: 'Execute gzip benchmarks to analyse quirky dev proxy flaws before building json.'
Prose typography
A code sample distinguishing easily confused glyphs — capital O, zero, capital I, one, and lowercase l — with arrow and comparison ligatures
Monospace typography
A set of outline interface icons in a grid, drawn at a consistent stroke weight to match Berkeley Mono.
Iconography
The twelve-step cyan ramp as vertical columns, running from near-white through saturated mid teal to near-black
Cyan
Four logo colorways in quadrants: deep teal on pale cyan, near-black on mid cyan, white on brand cyan, and light cyan on near-black
Logo colorways
The logomark repeated across four side-by-side panels, each pairing a different tone from the cyan ramp with its background
Logomark colorways
A grid of twelve-step ramps for the supporting hues, one hue per row, each running light to dark
Spectrum
Four status messages on dark cyan: Info in azure, Success in green, Warning in yellow and Error in red, each a tinted panel with a matching icon, title and one-line description.Column and pie charts of component instance counts, with each of eight components in a distinct supporting color and a legend beneath.Three rows of generic avatar icons in circles, tinted through rose, violet and orange in alternating lighter and darker steps.A JavaScript sample syntax-highlighted in the brand palette: blue keywords, yellow class names, green strings, red constants and a gray italic comment.
Interface colors
Cyan halftone photograph of a train passing in front of building facadesCyan halftone photograph of autumnal tree branchesCyan halftone photograph of a tropical fish in an aquariumCyan halftone photograph of cumulonimbus cloud
Photo treatment
Cyan halftone photograph of cumulonimbus cloud with a looping scan animation effectCyan halftone photograph of cumulonimbus clouds, adaptive to current light/dark modeCyan halftone photograph of cumulonimbus clouds, adaptive to current light/dark mode
Animated and adaptive photo treatment
Monospaced logo in white on a cyan halftone photograph of cumulonimbus clouds
Logo on photo treatment
Bluesky profile header for Monospaced: a cyan halftone banner, the logomark as the circular avatar, and the handle @monospaced.com.Link preview card for monospaced.com, showing the cyan halftone OG image above the site title and description.A browser's shortcuts row with six site icons; the last is the Monospaced logomark on a brand cyan tile, labelled 'monospaced'A Google search result for monospaced.com, with the logomark favicon beside the URL and the site description below.
Web
A phone on an oak table showing the monospaced.com homepage: a cyan halftone image above the strapline and introduction in monospaced type.A phone showing a long-form page on monospaced.com, with headings, a table and lists set in monospaced type on near-black. A phone showing the Screen web app with a cyan halftone photograph of cumulonimbus cloud in its loading state.
Mobile
The same phone and web app with the cloud photograph fully loaded.
Stickers
Two stylised posters representing aspects of the Monospaced visual brand identity hanging in wooden frames on a dark cyan wall
Posters