System overview
- Hero
- type-led · left
- Surface
- light
- Density
- sparse
- Content width
- 1200px
- Confidence
- medium
- Primary action
- Join as a radiologist
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 54.Surface
Repeated container or section fill; relative occurrence score 41.Surface
Repeated container or section fill; relative occurrence score 33.Primary text
Observed display foreground with 16.7:1 contrast against the captured canvas.Secondary text
Observed reading foreground; measured canvas-reference contrast is 6.0: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 Montserrat to display, heading text; Heebo to body, body-small, label text.
Metric previews use the observed CSS values. Source font files are not bundled, so unavailable families fall back locally.Radiology built to keep up.
Montserrat · 72px/72px · weight 800 · tracking -2.88px · color rgb(8, 32, 28)Your backlog isn't your fault. It is our problem.
Montserrat · 46px/48.3px · weight 700 · tracking -1.38px · color rgb(240, 245, 243)We helped build Carbon Health into a 100+ clinic care network serving millions of patients. Radley…
Heebo · 16px/26.4px · weight 300 · tracking 0px · color rgb(81, 102, 98)Results go to your ordering providers, critical findings get called, and follow-ups are tracked…
Heebo · 14px/22.4px · weight 400 · tracking 0px · color rgb(81, 102, 98)founders@radley.health
Heebo · 13px/20.15px · weight 400 · tracking 0px · color rgb(14, 143, 118)Spacing & shape
Spacing
- Base unit
- 8px
- Section gap
- 32px
- Container
- 32px
32px8px12px40px18px10px26px14px16px96pxShape
Rounded geometry is the dominant shape voice. Elevation is selectively reinforced with shadow.
- Pills
- 999px
- Containers
- 16px
- Media
- 0px
Inspect borders & shadows · 9
1px solid rgb(226, 235, 232)1px solid rgb(221, 232, 228)1px solid rgb(95, 242, 206)1px solid rgba(240, 245, 245, 0.200)rgba(8, 32, 28, 0.06) 0px 8px 24px 0pxrgba(8, 32, 28, 0.06) 0px 16px 44px 0pxrgba(8, 32, 28, 0.06) 0px 4px 14px 0pxrgba(8, 32, 28, 0.22) 0px 16px 36px 0pxrgba(8, 32, 28, 0.25) 0px 14px 34px 0pxComponent grammar
Hero
Opening proposition
Type led, left-aligned opening anchored by “Join as a radiologist”.
Inspect 4 properties
- Pattern
- type-led
- Alignment
- left
- Heading
- Montserrat · 72px / 800
- Media
- minimal
Navigation
Global wayfinding
Static navigation with 6 visible actions in the desktop opening.
Inspect 7 properties
- Text
- #08201c
- Border
- none
- Radius
- 0px
- Padding
- 18px 40px 18px 40px
- Type
- Heebo · 15px / 400
- Position
- static
- Height
- 78px
Primary action
Conversion
“Join as a radiologist” is the strongest first-viewport action by semantic intent and visual contrast.
Inspect 6 properties
- Background
- #ffffff
- Text
- #08201c
- Border
- 1px solid rgb(221, 232, 228)
- Radius
- 999px
- Padding
- 15px 26px 15px 26px
- Type
- Heebo · 16px / 500
Media frame
Visual proof
2 style-matched media elements were found among 2 rendered candidates; cover fitting and 0px are the most repeated treatments.
Inspect 4 properties
- Fit
- cover
- Ratios
- 0.99
- Radius
- 0px
- Candidate pool
- 2
Footer
Closing navigation
1 visible actions close the page on a transparent surface.
Inspect 6 properties
- Text
- #08201c
- Border
- 1px solid rgb(226, 235, 232)
- Radius
- 0px
- Padding
- 0px 0px 0px 0px
- Type
- Heebo · 15px / 400
- Links
- 1
Layout & narrative
The homepage continues through 11 observed sections, moving from the opening proposition into Your backlog isn't your fault. It is our problem, What happens to a study you send us, Hospitals.
- Structure
- Editorial product narrative
- Hero pattern
- Type-led hero: display copy is the primary graphic
- Grid
- 2 columns
- Closing
- Minimal closing footer
Full section sequence · 11
- Your backlog isn't your fault. It is our problem.
- What happens to a study you send us.
- Hospitals
- Founders
- Partner with Radley
- ~20% 98M Minutes
- The read
- Everything around it
- Coverage that holds
- Imaging centers
- Practice at the frontier
Imagery, motion & responsive
Imagery
Typography and surface contrast carry the page; rendered imagery is minimal.
cover fitting · square-edged framesInspect imagery inventory
- Composition
- The first viewport is type-led.
- Inventory
- 2 images/canvas elements and 0 videos across the analyzed homepage.
Motion
10 declared keyframes and 6 active animations were inspectable at capture; observed timing uses 1.5s, 1.618s, 1s.
Reduced-motion rules detectedInspect motion inventory
- Libraries
- CSS / browser-native or bundled source not identifiable
- Keyframes
- rad-pulse, rad-in, _spin_1nqjn_1, _wave_1nqjn_1, _heartBeat_1nqjn_1, _flash_1nqjn_1, _bounce_1nqjn_1, _rubberBand_1nqjn_1, _headShake_1nqjn_1, _tada_1nqjn_1
- Durations
- 1.5s, 1.618s, 1s, 1.3s, 2.5s, 2400ms, 500ms
- Easings
- ease, ease-in-out, linear
- States
- hover
Mobile
Desktop navigation reduces from 6 visible actions to 2. Hero alignment changes from left to center; mobile heading size is 42px.
Observed multi-column desktop regions collapse to a single-column mobile flow.Inspect responsive test
- Viewport
- 390 × 844
- Overflow
- No horizontal overflow detected
Reproduction guidance
Do
- Pair the observed #fcfdfd canvas with #08201c primary copy before adding secondary surfaces.
- Use Montserrat at 72px/72px, weight 800, for the primary display moment.
- Reserve the strongest first-viewport contrast for “Join as a radiologist” within the left-aligned type-led hero.
- Typography and surface contrast carry the page; rendered imagery is minimal.
Don’t
- Do not mix in arbitrary radii; 999px is the repeated treatment on pills.
- Do not reuse the #ffffff action color across decorative elements; keep its interactive emphasis selective.
- Do not introduce extra type families beyond Montserrat and Heebo.
- Do not spread the observed shadow treatment across every container; keep elevation selective.




