System overview
- Hero
- split · left
- Surface
- light
- Density
- sparse
- Content width
- 1600px full-width canvas
- Confidence
- low
- Primary action
- Join the Pilot Program
Color system
Light surfaces use 8 repeated semantic colors; the primary action carries the strongest interactive emphasis.
Page canvas
Dominant rendered page background.Surface
Repeated container or section fill; relative occurrence score 114.Surface
Repeated container or section fill; relative occurrence score 96.Surface
Repeated container or section fill; relative occurrence score 46.Primary text
Observed display foreground with 17.6:1 contrast against the captured canvas.Secondary text
Observed reading foreground; measured canvas-reference contrast is 9.7:1.Primary action
Fill used by the dominant first-viewport action.Border and divider
Most repeated inspectable border color.Typography
The observed type system assigns Playfair Display to display, heading text; Montserrat to body, body-small text; JetBrains Mono to label text.
Metric previews use the observed CSS values. Source font files are not bundled, so unavailable families fall back locally.Fabs of the future.
Playfair Display · 67.2px/70.56px · weight 500 · tracking -1.008px · color rgb(0, 22, 44)Every defect has a cost.
Playfair Display · 54.4px/58.752px · weight 500 · tracking -0.816px · color rgb(0, 22, 44)Complete sealed transport for wafers between manufacturing steps, with modular adapters into every…
Montserrat · 15.5px/25.1875px · weight 400 · tracking 0px · color rgba(0, 22, 44, 0.800)A single run takes VOC contamination from ambient down through 7N purity in 16 minutes. Measured,…
Montserrat · 14px/22.75px · weight 400 · tracking 0px · color rgb(100, 91, 75)hi@aerogensystems.com
JetBrains Mono · 12.5px/18.75px · weight 400 · tracking 0px · color rgb(0, 22, 44)Spacing & shape
Spacing
- Base unit
- 4px
- Section gap
- 96px
- Container
- 24px
24px28px20px96px16px56px12px8px4px40pxShape
Soft geometry is the dominant shape voice. Elevation is selectively reinforced with shadow.
- Media
- 6px
- Pills
- 9999px
- Containers
- 6px
- Buttons
- 0px
Inspect borders & shadows · 6
1px solid rgb(219, 218, 219)1px solid rgba(0, 24, 44, 0.251)rgba(0, 22, 44, 0.12) 0px 4px 16px -6pxrgba(0, 22, 44, 0.14) 0px 6px 18px -4pxrgba(0, 22, 44, 0.2) 0px 16px 40px -8pxrgba(0, 22, 44, 0.68) 0px 20px 44px -14pxComponent grammar
Hero
Opening proposition
Split, left-aligned opening anchored by “Join the Pilot Program”.
Inspect 4 properties
- Pattern
- split
- Alignment
- left
- Heading
- Playfair Display · 67.2px / 500
- Media
- video-led
Navigation
Global wayfinding
Static navigation with 6 visible actions in the desktop opening.
Inspect 7 properties
- Text
- #281d08
- Border
- none
- Radius
- 0px
- Padding
- 0px 0px 0px 0px
- Type
- Montserrat · 16px / 400
- Position
- static
- Height
- 20px
Primary action
Conversion
“Join the Pilot Program” is the strongest first-viewport action by semantic intent and visual contrast.
Inspect 6 properties
- Background
- #0090b9
- Text
- #fffaf7
- Border
- none
- Radius
- 9999px
- Padding
- 12px 28px 12px 28px
- Type
- Montserrat · 14.5px / 500
Media frame
Visual proof
6 style-matched media elements were found among 11 rendered candidates; contain fitting and 6px are the most repeated treatments.
Inspect 4 properties
- Fit
- contain, fill, cover
- Ratios
- 1.00, 3.24, 1.40, 1.78, 3.20
- Radius
- 6px, 0px
- Candidate pool
- 11
Footer
Closing navigation
5 visible actions close the page on a #bcdce5 surface.
Inspect 7 properties
- Background
- #bcdce5
- Text
- #281d08
- Border
- none
- Radius
- 0px
- Padding
- 0px 0px 0px 0px
- Type
- Montserrat · 16px / 400
- Links
- 5
Layout & narrative
The homepage continues through 9 observed sections, moving from the opening proposition into Every defect has a cost, Meet Talos, Clean room Pipes.
- Structure
- Split product narrative
- Hero pattern
- Split hero: message and proof share the first viewport
- Grid
- 2 columns
- Closing
- Utility footer with 5 actions
Full section sequence · 9
- Every defect has a cost.
- Meet Talos.
- Clean room Pipes.
- A pilot, not a pitch.
- The future of contamination control in semiconductor manufacturing.
- Facing yield problems? We'll build a system to fix it.
- Discussion
- Evaluation
- Integration
Imagery, motion & responsive
Imagery
Video led media acts as the page’s primary visual proof rather than decoration.
contain fitting · 6px repeated radiusInspect imagery inventory
- Composition
- A focused visual anchors the first viewport.
- Inventory
- 9 images/canvas elements and 2 videos across the analyzed homepage.
Motion
2 declared keyframes and 4 active animations were inspectable at capture; observed timing uses 0.1s, 0.2s, 0.3s.
Reduced-motion rules detectedInspect motion inventory
- Libraries
- CSS / browser-native or bundled source not identifiable
- Keyframes
- enter, exit
- Durations
- 0.1s, 0.2s, 0.3s, 0.7s, 700ms
- Easings
- ease, cubic-bezier(0, 0, 0.2, 1)
- States
- focus, transition-all, hover, active, disabled
Mobile
Desktop navigation reduces from 6 visible actions to 2. Hero alignment changes from left to center; mobile heading size is 48px.
Observed multi-column desktop regions collapse to a single-column mobile flow.Inspect responsive test
- Viewport
- 390 × 844
- Overflow
- Horizontal overflow detected
Reproduction guidance
Do
- Pair the observed #fffaf7 canvas with #00162c primary copy before adding secondary surfaces.
- Use Playfair Display at 67.2px/70.56px, weight 500, for the primary display moment.
- Reserve the strongest first-viewport contrast for “Join the Pilot Program” within the left-aligned split hero.
- Video led media acts as the page’s primary visual proof rather than decoration.
Don’t
- Do not mix in arbitrary radii; 6px is the repeated treatment on media.
- Do not reuse the #0090b9 action color across decorative elements; keep its interactive emphasis selective.
- Do not introduce extra type families beyond Playfair Display and Montserrat and JetBrains Mono.
- Do not copy transition-all declarations; keep only purposeful transform or opacity motion.