Door 1
Panel 1
Useful for service choices, benefits or installation steps.
Panel systems
French Door Style Four-Panel Layout
Tall panels, arched tops and mullion lines for content blocks that feel closer to the product than generic cards.
Door 2
Panel 2
Useful for service choices, benefits or installation steps.
Door 3
Panel 3
Useful for service choices, benefits or installation steps.
Door 4
Panel 4
Useful for service choices, benefits or installation steps.
Window grid
Three-Column Wide Window With Parallax
The columns drift differently as the section moves through the viewport, briefly lining up like a complete window.
01
Frames
Show grouped choices with movement that hints at opening panes.
02
Glass
Show grouped choices with movement that hints at opening panes.
03
Fitting
Show grouped choices with movement that hints at opening panes.
Blind reveal
Two-Column Bedroom Window Layout
Square panes for compact content, with a reveal animation like a blind opening from top to bottom.
Warmth
Keep Heat In
A simple visual format for benefits and problem/solution sections.
Style
Match the Home
Useful for design-led prompts without needing a heavy carousel.
Hardware details
Lock, Letterbox and Liquid Glass Ideas
Security as a visual motif
Door-lock shapes can hold stats, guarantees, FENSA proof or safety messages.
Letterbox lead prompts
A slim hardware-inspired slot works well for call-back forms, quote prompts and brochure downloads.
Liquid glass layouts
Two, Three and Four Column Content Blocks
Same component family, different layout counts. Window frames stay square; door frames use a separate class.
2 col
Quote Details
Light blue glass styling for calm lead-gen content blocks.
2 col
Home Visit
Light blue glass styling for calm lead-gen content blocks.
3 col
Frames
Good for option sets, benefits or product choices.
3 col
Glass
Good for option sets, benefits or product choices.
3 col
Hardware
Good for option sets, benefits or product choices.
4 col
Photos
Compact step or checklist pattern with glass-panel styling.
4 col
Sizes
Compact step or checklist pattern with glass-panel styling.
4 col
Style
Compact step or checklist pattern with glass-panel styling.
4 col
Quote
Compact step or checklist pattern with glass-panel styling.
Takeover reveal
Two-Column Sliding Door Takeover
Each column has its own panes, so the layout reads as two actual reveal panels.
Two pane
Quote prompt
Two sliding panes reveal focused lead-generation content.
Two pane
Call back
Two sliding panes reveal focused lead-generation content.
Alternative reveal
Two Columns Move as the Reveal
The cards themselves slide into place as the user scrolls, rather than panes placed over each card.
Two column
Door quote
The cards themselves slide into place as the user scrolls.
Two column
Window quote
The cards themselves slide into place as the user scrolls.
Alternative reveal
Three Columns Move as the Reveal
Side cards slide in while the centre card drops into alignment.
Three column
Frames
Side panes slide in while the centre pane drops into alignment.
Three column
Glazing
Side panes slide in while the centre pane drops into alignment.
Three column
Hardware
Side panes slide in while the centre pane drops into alignment.
Alternative reveal
Four Columns Move as the Reveal
Four cards move like a set of doors forming a clean row.
Four column
Photos
Four cards move like a set of doors forming a clean row.
Four column
Sizes
Four cards move like a set of doors forming a clean row.
Four column
Style
Four cards move like a set of doors forming a clean row.
Four column
Survey
Four cards move like a set of doors forming a clean row.
Window reveal
Three-Pane Wide Window Reveal
Three real columns, each with a three-pane reveal animation.
Three pane
Security
Three panes move away in different directions to reveal the content.
Three pane
Warmth
Three panes move away in different directions to reveal the content.
Three pane
Style
Three panes move away in different directions to reveal the content.
French reveal
Four-Column Sliding Door Reveal
Four actual columns for tall French-door style layouts, each revealing independently.
Four pane
Door
Useful for tall product systems or feature sets with a stronger door feel.
Four pane
Frame
Useful for tall product systems or feature sets with a stronger door feel.
Four pane
Glass
Useful for tall product systems or feature sets with a stronger door feel.
Four pane
Fitting
Useful for tall product systems or feature sets with a stronger door feel.