Get started
All interface styles

Retro / Vintage Print

Screen surfaces that borrow the artefacts of physical printing: halftone dots, slight misregistration, limited ink counts and paper texture.

Also called: vintage print, risograph, halftone, mid-century, letterpress

Your Design Kit keeps

Colors, typefaces, the spacing scale, motifs, and brand voice.

Retro / Vintage Print changes

Surface material, borders, shape, depth, component layout, states, and motion.

Retro / Vintage Print specimen

Base components
Customer health

Accounts at risk

Atlas workspace

On track

Renewal is due in 18 days. Weekly use is up and two seats were added this month.

Seats
24
Usage
+18%
Renewal
18 days
Priority
Open account12 min ago
Retro / Vintage Print applied
Customer health

Accounts at risk

Atlas workspace

On track

Renewal is due in 18 days. Weekly use is up and two seats were added this month.

Seats
24
Usage
+18%
Renewal
18 days
Priority
Open account12 min ago

Look for: The dot pattern stays behind decorative regions and never runs under body text. The misregistration is a decorative offset layer, so the button's actual edge, hit area and focus ring remain exactly where they look like they should be.

Both panels use the same sample Design Kit and account screen. Only the interface style changes on the right.

Choose what to restyle

Select a scope to create a prompt for your coding agent. Start with one component family or apply the style across the interface.

Choose what the style should change
Apply Retro / Vintage Print to cards, panels, sheets, and modals only. Keep my Design Kit's colors, typefaces, and motifs. Leave navigation, forms, actions, and page structure unchanged. Show me one representative card first, then explain the accessibility trade-offs before changing the rest.
Paste this into your coding agent, then add any product-specific constraints.

What you see

The perceptual fingerprint, in the order you notice it.

  • Halftone or duotone dot patterns instead of smooth gradients
  • A deliberately limited ink palette, two or three colours doing all the work
  • Slight offset between colour layers, as if the press was misaligned
  • Warm paper-toned background rather than white
  • Type set with generous letterspacing in a period-appropriate weight

Best for

  • Craft, food, publishing and studio brands with a made-by-hand story
  • Campaign pages and editorial features that want to feel printed
  • Products whose kit already leans warm and limited in palette

Avoid when

  • The interface is functional — print artefacts add noise to controls
  • Contrast is already tight; halftone and paper tone both reduce it
  • The brand is contemporary-technical, where nostalgia reads as confusion

Accessibility

Where this style tends to fail an audit, and what fixes it.

  • Halftone under text lowers effective contrast in a way a colour picker will not show. Never place body copy over a dot pattern; keep it on solid ink or solid paper.
  • Misregistration must be decorative only. If a control's edge is offset, the underlying hit area and focus ring must stay aligned.
  • Paper texture plus warm tone can push a nominally passing pair under 4.5:1 — measure the composite, not the token.

Built for

The site archetypes this render grammar suits. Each opens the catalog on that lane.

Matching design kits

A style is a render grammar. A design kit supplies the colour, type and personality it paints.

Analog print heritage — 70s/80s graphic systems, risograph/screen-print duotones, gig posters, vinyl, slab-serif, halftone.

Implementation bundle

Pro

What an agent needs in order to actually build Retro / Vintage Print on top of your design kit — surface rules, per-component behaviour, responsive behaviour, fallbacks and QA.

Loading the implementation bundle…

Agent tags

The vocabulary a coding agent can match this style on.

  • halftone
  • limited-ink
  • misregistration
  • paper-texture
  • letterpress-type