Edit me
How to make it yours.
Everything on this site is editable without code. Start here.
01
Colours
Assets → Colours. Vault, Bone, Paper, Fog and Reagent drive every section.
Assets → Colours. Vault, Bone, Paper, Fog and Reagent drive every section.
02
Type
Assets → Text Styles. Hero, Display, Heading, Statement, Body and Label share one scale.
Assets → Text Styles. Hero, Display, Heading, Statement, Body and Label share one scale.
03
Hero molecule
Home → Hero → Specimen pin → Molecule. Swap the image; cut-outs on a transparent ground work best.
Home → Hero → Specimen pin → Molecule. Swap the image; cut-outs on a transparent ground work best.
04
Specimen stage
Select Specimen Stage and edit each specimen. In headings, write **bold** and *light italic*.
Select Specimen Stage and edit each specimen. In headings, write **bold** and *light italic*.
05
Big numbers
The counters are Count Up components. Set the value, decimals, suffix and size per breakpoint.
The counters are Count Up components. Set the value, decimals, suffix and size per breakpoint.
06
CMS
Research, Team, Careers and News are CMS collections. Add an item and every list updates.
Research, Team, Careers and News are CMS collections. Add an item and every list updates.
07
Motion
Scroll motion comes from overrides in Motion.tsx. Clear an override to remove it. Reduced motion shows everything at rest.
Scroll motion comes from overrides in Motion.tsx. Clear an override to remove it. Reduced motion shows everything at rest.
08
Navigation
On Home the navigation sits at the foot of the hero, then slides in at the top. Keep that layer named Hero bar.
On Home the navigation sits at the foot of the hero, then slides in at the top. Keep that layer named Hero bar.
09
Forms
The contact form uses Framer forms. Choose where submissions go in the form settings.
The contact form uses Framer forms. Choose where submissions go in the form settings.