The Lenscraft — Style Guide
The colors, type, components and signature devices that keep every page on brand. Reference this before building a new section.
Colors
Paper (bg)#FFFFFF
Surface#FAF9F7
Ink#16161A
Accent (Red)#D50C1F
Typography
Heading 1 / Space Grotesk 600
Heading 2 / Space Grotesk 600
Heading 3 / Space Grotesk 600
Body text / Inter 400. This is the running-text style used across the site for paragraphs, descriptions and form labels. Comfortable line-height, measured width, never full-bleed.
Buttons
Signature Components
Focus bracket: 2px red border frames every photograph on the site.
Icon box
Red icon + heading + description. Used for benefits, services and differentiators.
Ring mark: a red-outline circle with a solid center, used as a non-numbered list marker.
Spacing & Shape
Radius: 2px everywhere (buttons, image frames, cards). Never fully rounded.
Spacing scale: sm 16px · md 30px · lg 64px.
Elevation: no drop shadows. Hierarchy comes from hairline borders (#E8E5E1) and background-color changes between sections.
Spacing scale: sm 16px · md 30px · lg 64px.
Elevation: no drop shadows. Hierarchy comes from hairline borders (#E8E5E1) and background-color changes between sections.