Signal yellow on black over white, with two carved dividers that give every page a horizon. A high-visibility trades system for whole-home contractors, extracted section by section from a working Northern Colorado home services site.
Tokens, type ramp, buttons, cards and the signature anchors.
37 patterns, every one transcribed from a live section with its source URL.
The flagship demo, mirroring the source homepage's real section order.
Live previews of the homepage and all three service landings.
The accent measures 15.56:1 against black and 1.35:1 against white. It carries black ink on buttons, chips and bands, and becomes a text colour only where the ground is dark. That is what the source already does everywhere the colour works.
A layered mountain ridge closes every hero and opens the footer. A three-layer swoosh in navy, yellow and white hands the page into the locations band. The source ships both as raster PNGs. Here they are inline SVG, so they recolour with the palette and stay crisp at any width.
The radius census over every painted box returns 0px on 149 elements. The exception is a 1em capsule on buttons, review cards and content panels. Seven of 78 buttons are true pills. Elevation comes from hairline borders, not shadow.
The only two faces that render on the source, both free Google families, so no substitution was needed and no display metrics were re-tuned. The page itself requests Cabin and Roboto, which paint almost nothing. Reading the head would have produced the wrong system.
Foundation's stock link blue sits ninth in the source's CSS with 327 declarations and renders on zero elements. Two more amber tones behave the same way. Ranking by declaration count would have put a framework default in the palette.
Heating, cooling, plumbing, drains, septic and electrical all carry equal weight in the source's navigation. The catalog is larger than most because the site genuinely runs that many service templates, plus careers, membership, coupons, locations and a 244-post blog.
_shared.cssTokens and every component class. The only stylesheet the pages link.palettes.jsonBeacon (extracted) plus three luminance-matched variants.brand-spec.mdVoice anchors, token evidence, pattern inventory, crawl-scope log, forbidden list.sections.htmlThe 37-pattern catalog.homepage.htmlFlagship demo in the source's own section order.landing-1-cooling.htmlCooling service landing.landing-2-plumbing.htmlPlumbing service landing.landing-3-septic.htmlSeptic service landing.design-system.htmlSwatches, type ramp, buttons, cards, signature anchors.pages.htmlGallery of live page previews.index.htmlThis overview.assets/hvac-beacon-brand/Two logo marks and eleven photographs pulled from the source.