a tiny utility from s3 labs

Create professional style guides.
In just seconds.

Enter any website URL and receive a comprehensive, beautifully formatted PDF style guide documenting colors, typography, components, and more.

try:

Explore Our Other Apps
≈47s
average run
19pp
guide length
0
accounts to create
∞
link lifetime

features

Everything a handoff needs. Nothing it doesn’t.

Six things, done well. Built for the dev-to-design handoff, not the demo reel.

Color extraction

We pull every brand-meaningful color, classify primary, secondary, accent, surface, and text — and write hex, RGB, and HSL.

rgb · hex · hsl

Typography analysis

Detected font families, weights, and sizes resolve into a clean, ratio-based type scale your team can actually use.

modular scale

Component detection

Buttons, inputs, cards, and nav patterns are identified and documented with their states and structural specs.

buttons · forms · cards

Accessibility audit

WCAG AA / AAA contrast checks on every text–surface pair. Failures are flagged with the contrast ratio.

WCAG 2.2

Print-ready PDF

A 19-page document with cover, table of contents, sections, and an index — formatted for screen and A4 print.

A4 · letter

Under 60 seconds

Crawl, classify, render, paginate. Average run takes 47 seconds. Long tail capped at one minute.

≈ 47s avg

how it works

Three steps. One minute.

01

Paste a URL

Drop in any public site. We crawl the homepage and one level deep, render with a real engine, and capture computed styles.

GET /analyze → 200
02

We classify

Tokens get clustered, named, and ranked. Type collapses into a scale. Components are detected by shape, not selector.

tokens: 142 · roles: 7
03

Download a PDF

Stable URL at stylesnap.sh/r/<slug>. Open it, share it, print it. Re-runs replace the file at the same link.

/r/9kR2vH.pdf

the output

A pdf style guide. Professionally Styled.

The output is one PDF. Designed for the handoff: a cover, a table of contents, then the work — colors, type, components, accessibility, and a versioned changelog. Send it to a client or print it for the kickoff.

  • Cover page with a captured brand mark
  • Table of contents and document index
  • Color palette with hex, RGB, and HSL values
  • Typography scale and font specifications
  • UI component documentation with states
  • Layout, grid, and spacing tokens
  • Accessibility compliance report
  • Resource links and a versioned changelog
stripe.com
Brand & design style guide
Generated by StyleSnap · v1.0
2.2 — color palette
Primary
#021A2E
Secondary
#014379
Accent
#0D91FD
Text
#374151
Surface
#F9FAFB
2.3 — typography
Heading 1
Heading 2
Heading 3
Body text looks like this, with comfortable readability for paragraphs of any reasonable length.
Caption text for smaller details and meta.
stylesnap.sh / r / 9kR2vHpage 04 / 19
19 pages · ready in 47s

questions

Things worth asking.

Yes, StyleSnap allows users to create up to 3 style guides per month. No purchase required.
Any public website that loads without authentication. We render the page in a real browser, so SPAs, lazy-loaded fonts, and CSS-in-JS all work. Behind a login or VPN — not yet.
Most runs finish in less than 1 minute, but more complex sites could take longer.
For now, the PDF that’s generated is final. We may add capabilities like this to our Pro plan ($4 one time purchase).
We cache the rendered output for 24 hours so re-downloads are instant, then it’s purged. The PDF stays at its slug forever.
Each guide gets a 6-character Base62 slug — e.g. stylesnap.sh/r/9kR2vH. Not indexed, not listed. Shareable means shareable on purpose.
S3 Labs, a small software studio that specializes in extremely simple and effective single-purpose tools. All S3 products are either free or require a small 1-time purchase. No subscriptions. Ever.