foxmowing-nsw.com.au/

open ↗ 2026-06-11 12:05 UTC · 112 css files · 3441kb css

rendered capture (headless)

Live reference

Preview — our components × captured values

A-side — Captured ↗Every component in the captured values · gaps shown · device toggle B-side — Proposed ↗My proposed CSS applied — the generative "what it could become" C-side — Derived ↗A complete, coherent library derived by rule from the captured DNA

Quick look above; the showcases render the full Slipstream bank with sample data. Captured values only on A-side — anatomy stays ours until we craft a library.

Style Guide preset (skin)

primary

#c2d82e

pri-accent

#e0e722

secondary

—

sec-accent

—

Surfaces — page · alt · emphasis · inverse

page

#f7f7f2

alt

—

emphasis

—

inverse

#1a1a1a

Heading font: Montserrat (Google)
Body font: Inter (Google)
Heading line-height: 1.15
Mobile h1: 60px → 36px ⚠ big
Mobile overflow: none
Base size: 16px
Type scale: not detected
Rounding: Slightly rounded (6px)
Line width: not detected
Button hover: swap background + lift + shadow
Text-over-image halo: not detected
Heading tracking: not detected
Label tracking: not detected
Focus ring: not detected
Easing: not detected
Container max: 510px
Section padding: 80px
Accent gradient: not detected
Icon stroke: not detected
Spacing unit: not detected
Transition: 300ms
Link underline: false
Button: not detected

rendered (getComputedStyle on laid-out page) — higher fidelity than the regex engine

Contact form — how the fields render

field border

#cbd5e1

field fill

#f8fafc

field text

#334155

focus

#cbd5e1

submit

#c2d82e

Captured from: foxmowing-nsw.com.au/ (home page)
Fields: 9 · multi-column
Field border: 1px solid #cbd5e1
Field radius: 6px
Field height: 50px
Field padding: 12px 16px 12px 16px
Field font: Inter 15px
Field shadow: not detected
Focus state: none
Label: no visible labels
Submit: "Get a FREE Quote Now" · #c2d82e · radius 6px · full-width

Captured form-field facts. These feed the contact-form component — see the field-token proposal in docs/contact-form-component.md.

Capture audit — what's real vs default

13 of 27 values captured from this site. The rest fall back to library defaults — shown so nothing hardcoded can pass as captured.

Brand primarycaptured: #c2d82e
Secondary colourdefault
Page backgroundcaptured: #f7f7f2
Text colourdefault
Text colour (inverse)default
Heading colourdefault
Link colourdefault
Link colour (inverse)default
Heading fontcaptured: Montserrat
Body fontcaptured: Inter
Heading size (H1)captured: 100px
Heading weightcaptured: 800
Heading trackingdefault
Primary button bgcaptured: #e0e722
Primary button radiuscaptured: 6
Roundingcaptured: 6px
Line / border widthdefault
Button hoverdefault
Focus ringdefault
Easingdefault
Transition speedcaptured: 300ms
Container max-widthcaptured: 510px
Section paddingcaptured: 80px
Accent gradientdefault
Image treatmentcaptured: captured
Text-over-image halodefault
Icon strokedefault
Alt background (derived from page)library default
Card paddinglibrary default
Small/large shadow scalelibrary default
Secondary-button outline stylelibrary default

Inventory (raw evidence)

Palette by frequency

#ffffff ·694

#000000 ·557

#c2d82e ·196

#eeeeee ·125

#aaaaaa ·88

#020101 ·64

#1f2124 ·61

#cccccc ·58

#69727d ·58

#cc3366 ·52

#112337 ·49

#5897fb ·48

#333333 ·47

#d9534f ·47

#dddddd ·40

#888888 ·40

#f5f5f5 ·37

#5cb85c ·33

Radii

0px1px2px3px4px5px6px8px10px12px15px20px

Shadow samples

none !important

rgba(0, 0, 0, 0.09) 0px 0px 5px 0px !important

0 10px 25px -3px rgba(0, 0, 0, 0.05), 0 4px 6px -2px rgba(0, 0, 0, 0.05) !important

0 0 0 3px rgba(194, 216, 46, 0.15) !important

0 4px 12px rgba(194, 216, 46, 0.2) !important

Character & component map

Shadow usage: heavy
Border usage: heavy
Gradients: present
Uppercase labels: yes (motif)
Letter-spacing: yes

Components observed vs gaps (gaps left empty — never auto-filled)

navobserved
heroobserved
buttonsobserved
cardobserved
pricingGAP
testimonialobserved
feature-gridobserved
galleryobserved
accordion-faqobserved
tabsobserved
tableGAP
formobserved
footerobserved
dropdownobserved

Worth considering — seen here, not yet captured

Notable styling present in this site's CSS that the tool doesn't yet turn into a captured value — candidates for future capture. Full coverage & roadmap →

object-fit98×
filter (blur etc.)68×
CSS mask33×
mix-blend-mode20×
scroll-behavior14×
scroll-snap4×
sticky positioning3×
will-change (perf)3×

Beyond the capture — Claude's read & generative proposals

The character CSS mining can't reach — bespoke anatomy, motifs, the "feel". These are my interpretations and generative suggestions. They are NOT applied to the reconstruction above — they're ideas to react to when this becomes a library's seed.

Not reviewed yet. Ask Claude in chat to “read this teardown” and I'll add observations + generative proposals here.