Sections that already belong to a page.
Every section here is a live component from one of the templates, mounted directly rather than copied out. Improving one improves both, because they are the same file. Each consumes the seven certified role tokens and nothing else, which is what lets it carry any palette in the library.
Navigation
The chrome. Sixteen of these are sticky and two are fixed, and each answers the same question differently: what should a header do once the reader has moved?
- NavAgency
agency/nav - NavAI Agent
agent/nav - NavData / Analytics
basedash/nav - NavDev Tool / Infra
devtool/nav - NavLandscape / Editorial
duna/nav - NavFintech
fintech/hero - NavKnowledge / Docs
knowledge/nav - NavLending / Regulated AI
lending/nav - NavMobile App
mobile/nav - NavResearch / Testing
research/nav - NavSaaS
saas/nav - NavStartup
startup/nav - NavProductivity / Email
superhuman/nav - NavVoice / Dictation
voice/nav - NavConversational AI
voiceflow/nav - NavAutonomy / Robotics
waabi/nav
Hero
The opening statement. One image or one mechanic, committed to fully.
- HeroAgency
agency/hero - HeroAI Agent
agent/hero - HeroData / Analytics
basedash/hero - HeroDev Tool / Infra
devtool/hero - HeroLandscape / Editorial
duna/hero - HeroFintech
fintech/hero - HeroFrontier / Deep Tech
frontier/hero - HeroKnowledge / Docs
knowledge/hero - HeroLending / Regulated AI
lending/hero - HeroMobile App
mobile/hero - HeroPlayful App
playful/hero - HeroResearch / Testing
research/hero - HeroSaaS
saas/hero - HeroStartup
startup/hero - FoldProductivity / Email
superhuman/fold - HeroVoice / Dictation
voice/hero - HeroConversational AI
voiceflow/hero - FoldAutonomy / Robotics
waabi/fold
Logo wall
The trust strip. A row of marks placed early, moving slowly enough that nobody reads it as motion.
- Proof BandData / Analytics
basedash/proof - Proof StripLandscape / Editorial
duna/proof - Logo MarqueeFintech
fintech/rail - LogosFrontier / Deep Tech
frontier/logos - LogosLending / Regulated AI
lending/logos - MarqueeStartup
startup/marquee - RailProductivity / Email
superhuman/rail - TickerVoice / Dictation
voice/ticker - PartnersAutonomy / Robotics
waabi/pact
Feature
The middle of the argument, and the widest family by far. Each one shows a different thing the product does, using a layout shape no other section on its page repeats.
- StatementAgency
agency/statement - JumpAgency
agency/jump - WorkAgency
agency/work - SignalsAI Agent
agent/signals - DeckAI Agent
agent/deck - PersonasAI Agent
agent/personas - ProofAI Agent
agent/proof - ComposeData / Analytics
basedash/compose - AskData / Analytics
basedash/ask - GovernData / Analytics
basedash/govern - SourcesData / Analytics
basedash/sources - CustodyData / Analytics
basedash/custody - QueriesData / Analytics
basedash/queries - BlocksDev Tool / Infra
devtool/blocks - WorksLandscape / Editorial
duna/works - SkyLandscape / Editorial
duna/sky - TrustLandscape / Editorial
duna/trust - IndexLandscape / Editorial
duna/entries - Product RailFintech
fintech/rail - Business CarouselFintech
fintech/carousel - Developer BlockFintech
fintech/developer - Feature GridFintech
fintech/features - BandFrontier / Deep Tech
frontier/band - ContourFrontier / Deep Tech
frontier/contour - BasaltFrontier / Deep Tech
frontier/basalt - LedgerFrontier / Deep Tech
frontier/ledger - RosterFrontier / Deep Tech
frontier/roster - TrackerKnowledge / Docs
knowledge/tracker - LanesKnowledge / Docs
knowledge/lanes - SystemKnowledge / Docs
knowledge/system - EnterpriseKnowledge / Docs
knowledge/enterprise - ConsoleLending / Regulated AI
lending/console - SwitchboardLending / Regulated AI
lending/switchboard - AgentsLending / Regulated AI
lending/agents - ComplianceLending / Regulated AI
lending/compliance - FeaturesMobile App
mobile/features - CompareMobile App
mobile/compare - SimulatorMobile App
mobile/simulator - GlobeMobile App
mobile/globe - SecureMobile App
mobile/secure - DevicesPlayful App
playful/devices - FeaturesPlayful App
playful/features - WallPlayful App
playful/wall - PlatformsPlayful App
playful/platforms - EcoPlayful App
playful/eco - ArcResearch / Testing
research/arc - BoardResearch / Testing
research/board - LexiconResearch / Testing
research/lexicon - NeedsResearch / Testing
research/needs - BandResearch / Testing
research/band - LedgerResearch / Testing
research/ledger - MatrixResearch / Testing
research/matrix - ReportResearch / Testing
research/report - GrowSaaS
saas/grow - ConsolidateSaaS
saas/consolidate - SecuritySaaS
saas/security - ReviewStartup
startup/review - RecomposeStartup
startup/recompose - LibraryStartup
startup/library - About BandStudio
studio/contact-sheet - RollStudio
studio/roll - Shot ListStudio
studio/shot-list - Gate CheckStudio
studio/gate-check - LedgerProductivity / Email
superhuman/ledger - StripProductivity / Email
superhuman/strip - TranscribeVoice / Dictation
voice/transcribe - CompareVoice / Dictation
voice/compare - RailVoice / Dictation
voice/rail - StackVoice / Dictation
voice/stack - BuildConversational AI
voiceflow/build - SplitConversational AI
voiceflow/split - AudienceConversational AI
voiceflow/split - IntegrateConversational AI
voiceflow/integrate - SecurityConversational AI
voiceflow/integrate - StoriesConversational AI
voiceflow/close - BannerAutonomy / Robotics
waabi/claim - CardsAutonomy / Robotics
waabi/deck - DuoAutonomy / Robotics
waabi/duo - InsightsAutonomy / Robotics
waabi/rail - CascadeAutonomy / Robotics
waabi/cascade
How it works
The explanation. Numbered steps, scroll timelines, and pinned scenes that run a state machine as the reader travels.
Metrics
The figures. Numerals at display scale, usually on a single rule, usually counting.
Testimonial
One voice, or several. The library leans toward one at a time - two testimonials on a page read as filler.
- VoicesDev Tool / Infra
devtool/voices - VoicesLandscape / Editorial
duna/voices - SpotlightFrontier / Deep Tech
frontier/spotlight - QuoteKnowledge / Docs
knowledge/quote - StoriesKnowledge / Docs
knowledge/stories - VoiceLending / Regulated AI
lending/voice - ReviewsMobile App
mobile/reviews - VoicesPlayful App
playful/voices - VoiceResearch / Testing
research/voice - VoiceSaaS
saas/voice - VoicesStartup
startup/voices - VoicesProductivity / Email
superhuman/voices - VoicesConversational AI
voiceflow/voices
Pricing
The moment of decision. Tiers, comparisons, and estimators that stay honest about cost.
FAQ
The last objections, set as an open list rather than an accordion wherever the answers are short enough to read at once.
Call to action
The close. One ask, nothing else in the band.
- CloseAgency
agency/close - CloseAI Agent
agent/close - CloseData / Analytics
basedash/close - CloseDev Tool / Infra
devtool/close - CloseFrontier / Deep Tech
frontier/cta - Arrival BandKnowledge / Docs
knowledge/cta - CloseLending / Regulated AI
lending/close - ClosePlayful App
playful/close - SignupResearch / Testing
research/signup - CodaResearch / Testing
research/cta - StartSaaS
saas/start - CloseStartup
startup/close - Booking StripStudio
studio/booking-strip - Contact CloseStudio
studio/contact-sheet - CloseProductivity / Email
superhuman/close - CloseVoice / Dictation
voice/close - CloseConversational AI
voiceflow/close
Footer
The last thing a reader sees. It has to do real navigational work and still land the page, rather than trailing off into a link dump.
- FooterAI Agent
agent/footer - FooterData / Analytics
basedash/footer - FooterDev Tool / Infra
devtool/footer - FooterLandscape / Editorial
duna/footer - FooterFintech
fintech/footer - FooterFrontier / Deep Tech
frontier/footer - FooterKnowledge / Docs
knowledge/footer - FooterLending / Regulated AI
lending/footer - FooterMobile App
mobile/footer - FooterPlayful App
playful/footer - FooterResearch / Testing
research/footer - FooterSaaS
saas/footer - FooterStartup
startup/footer - FooterProductivity / Email
superhuman/footer - FooterVoice / Dictation
voice/footer - FooterAutonomy / Robotics
waabi/footer
One motion idea. Real depth. No theme leakage.
- 01Role tokens only
- 02Responsive from 375 to 1440
- 03Static reduced-motion composition
- 04Mounted from its template, never copied