Chrome extension · Free + Pro

Every site has a design system.
See it in one click.

Sitegeist reverse-engineers the page you're on: palette with usage counts, type scale, real button styles with hover states, spacing, tech stack, and the writing's tone of voice. Export the code, batch download images, and audit any page for SEO.

Add to Chrome We're on Product Hunt

Tools

Inspect overlay Eyedropper Full-page shots Hard refresh Token export Side panel

Analysis

Tech + SEO Type scale + fonts Colors + sources Buttons + states Spacing Assets Content + voice

SITEGEIST

Colors

#e8e8ec

6 instances ⌄

a.btn.primary:hover

#a0a0a6

31 instances ⌄

span.kickerh1 span.softfooter

#121214

18 instances ⌄

span.chipspan.kicker

#d98a3d

2 instances ⌄

body::before

#2e3d78

5 instances ⌄

body::before

SITEGEIST

Typography

Loaded fonts

JetBrains Mono SG400600

Every site has a design system.

font-size: 42px
font-weight: 600
line-height: 1.15

Sitegeist reverse-engineers the page you're on.

SITEGEIST

Buttons

Button

Add to Chrome

background: rgb(255, 255, 255)
color: rgb(0, 0, 0)
border: 1px solid rgb(255, 255, 255)
border-radius: 999px
padding: 11px 20px
font-size: 12px

hoverbackground: rgb(232, 232, 236)

Button · Ghost

We're on Product Hunt

background: rgba(0, 0, 0, 0)
color: rgb(255, 255, 255)
border: 1px solid rgb(255, 255, 255)

SITEGEIST

Tech Overview

SITEGEISTThe spirit of any site, captured.

Sitegeist.designbuff.co

Sitegeist is a Chrome extension that reverse-engineers any website's design system: colors, type, buttons, spacing, assets, tech, and tone of voice.

Sitemap/sitemap.xml

TechHTMLCSSJS

HostingGitHub Pages

AnalyticsNone detected

SchemaWebSiteSoftwareApplication

Every site has a design system.See it in one click.

Every site has a design system.
See it in one click.